開發是前後端分離，不需要等待後臺開發。前端自己模擬數據，經本人測試成功。

我們在根目錄新建存放數據的json文件，存放我們的數據data.json

//data.json
{
  "status":"0",
  "result":[
    {
        "productId":"10001",
        "productName":"小米6",
        "prodcutPrice":"2499",
        "prodcutImg":"mi6.jpg"
    },
    {
      "productId":"10002",
      "productName":"小米筆記本",
      
 
"prodcutPrice":"3999",
      "prodcutImg":"note.jpg"
    },
    {
      "productId":"10003",
      "productName":"小米6",
      "prodcutPrice":"2499",
      "prodcutImg":"mi6.jpg"
    }
  ]
}

在build文件夾下的webpack.dev.config.js中：

// 引入各個文件
const express = require(‘express‘)
const app = express()
const router = express.Router()
const goodListData = require(‘../data.json‘)
app.use(‘/api‘, router)

//該代碼已經存在，我們是加入 before函數
const devWebpackConfig = merge(baseWebpackConfig, {
  devServer: {
    // 在devserver中加入before函數
    before(app) {
      app.get(‘/api/goodList‘, (req, res, next) => {
        res.json(goodListData)
      })
 

    }
  },
})

這樣以來我們就可以通過http://localhost:8080/api/goodList訪問數據了

vue mock(模擬後臺數據) 最簡單實例——適合小白