引包
1. npm install mockjs --save-dev
2. npm install axios --save（axios使用不再講）

修改配置
3. 在config文件夾下的dev.env.js修改如下

‘use strict‘
const merge = require(‘webpack-merge‘)
const prodEnv = require(‘./prod.env‘)

module.exports = merge(prodEnv, {
  NODE_ENV: ‘"development"‘,
  MOCK: ‘true‘
})

4. 在config文件夾下的prod.env.js修改如下

‘use strict‘
module.exports = {
  NODE_ENV: ‘"production"‘,
  MOCK: ‘false‘
}

5. 在main.js裏面做如下配置

process.env.MOCK && require(‘@/mock‘)

6. 在src目錄下創建mock目錄index.js,代碼如下：

require(‘./user‘)
const Mock = require(‘mockjs‘)

Mock.setup({
  timeout: 200
})

　　同級創建user.js,代碼如下

Mock.mock(‘/api/v1/getUserInfo‘, ‘get‘, {
  code: 200,
  data: {
    fullName: ‘@CNAME‘, 
    email: ‘@EMAIL‘, 
    user_id: 10001213213,
    username: ‘william‘,
    date: ‘@date‘,
    "array|1-10": [
      {
        "city|+1": [
          "北京",
          "上海",
          "天津"
        ]
      }
    ]
  },

  message: ‘success‘
})

　　說明: /api/v1/getUserInfo是自定義的path，可以單獨放一個文件然後引入，data裏面詳細配置見：http://mockjs.com/examples.html

在任意component裏面請求

this.$http.get(‘/api/v1/getUserInfo‘).then(res => {
console.log(res)
})

#### ==註意==
##### 10、mock只是對項目內部的ajax請求進行攔截，並不對外提供接口服務。在外部進行接口調用是無效的。
##### 11、mock會攔截定義的URL，未定義的url, mock是不會攔截的。

在vue-cli中使用mock.js詳解