vue-cli配置mock数据

旧版本vue-cli参考如下文章:
【最简单版】vue-cli项目中怎么mock数据

因为最新版本的vue-cli已经放弃dev-server.js,只需在webpack.dev.conf.js配置就行
新版vue-cliwebpack.dev.conf.js配置如下:

原文地址:
vue-cli的build的文件夹下没有dev-server.js文件,怎么配置mock数据

在const portfinder = require(‘portfinder’)后添加

const express = require('express')
const app = express()
var appData = require('../mock/goods.json')//加载本地数据文件
var apiRoutes = express.Router()
app.use('/api', apiRoutes)

//然后文件中找到devServer,在里面添加

 before(app) {
      app.get('/api/appData', (req, res) => {
        res.json({
          errno: 0,
          data: appData
        })//接口返回json数据,上面配置的数据appData就赋值给data请求后调用
      })
    }

然后npm run dev,一定要重启 一下!!然后就可以http://localhost:8080/api/appData 访问了

截图如下

image.png
image.png
image.png
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容