vue项目用nodejs实现模拟数据方法

提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

1）在项目根目录（如demo）中创建一个文件夹，如base，将项目中所有的前端文件全部放到base文件夹中，此时项目demo下只有一个文件夹base

2）通过cmd进入命令窗口，直接执行npm install express-generator -g （全局安装express）

3）通过cd命令进入项目demo目录，在demo目录下执行express mock -e （mock为创建的文件夹名，用来存放node模拟数据）；

4）让前端文件base中的端口号与mock中的端口号一致，一般默认为3000,下边标红的为端口号

mock/bin/www.js中的端口 var port = normalizePort(process.env.PORT || '');

base/config/index.js

module.exports = {
dev: { // Paths
assetsSubDirectory: 'static',
assetsPublicPath: '/',
proxyTable: {
'/': {
// 测试环境
target: 'http://localhost:', // 接口域名这里的端口号3000
changeOrigin: true, //是否跨域
pathRewrite: {
'^/': '/' //需要rewrite重写的,
}
}
},

经过以上配置后，就可直接在mock/routes/index.js中写接口文件，这样不管是通过post还是通过get方式，均可获取到对应数据

在mock/app.js中

app.use('/', indexRouter);
app.use('/users', usersRouter);

通过以上配置，默认访问routes/index.js。如需将接口文件放到user.js中，则需要在接口前边添加/users/

webpack中配置文件详解：https://blog.csdn.net/itKingOne/article/details/70331783?locationNum=3&fps=1