nuxt.js 在开发环境使用 mock
安装npm install mockjs -D新建mock文件夹目录结构如下plugins/mock/index.jsimport management from './constant/app'console.log(process.env.NODE_ENV,'process.env.NODE_ENV'); // developmentif(process.env.NODE_ENV === 'd
·
安装
npm install mockjs -D
新建mock文件夹目录结构如下

plugins/mock/index.js
import management from './constant/app'
console.log(process.env.NODE_ENV,'process.env.NODE_ENV'); // development
// mockjs 导致上传文件报错 request.upload.addEventListener in not a function
// https://blog.csdn.net/jbguo/article/details/101774784
// 再不适用mockjs的阶段请关闭掉
if(process.env.NODE_ENV === 'development' && false){
const Mock = require('mockjs')
/**
* x[0] url路径
* x[1] 请求方式
* y 接口响应的内容
**/
for(let [x,y] of management){
Mock.mock(x[0], x[1], (data) => {
console.log(data,'mock get');
return y
})
}
}
plugins/mock/constant/app.js
const { mock, Random } = require('mockjs')
const baseUrl = '\/api'
let id = 1
// 路径使用正则匹配,使用RegExp生成真个可以使用变量做通用路径,
// 路径不能使用字符串是完全匹配,使用的话请求路径的问号后面随机参数也要加上
const vG= [
[ new RegExp(`${baseUrl}\/data`), 'post'],
{
"data": {
...mock({
"v|6-9": [
{
'id': function(){return id++}, // 自增id
"o": mock('@ctitle(3,10)'), // 设置3到10个中文字标题
"n": mock('@ctitle(3,10)'),
"g": mock('@string("number",1,20)') // 设置字符串类型的数字个数 1到20个
}
]
})
}
}]
export default new Map ([
vG
])
nuxt.config.js
const pluginsValue = [
'@/plugins/element-ui',
'@/plugins/permission',
{
src: '@/plugins/composition',
ssr: false
},
]
// 只在开发环境加载
if (process.env.NODE_ENV === 'dev') {
pluginsValue.push('@/plugins/mock/index')
}
console.log(process.env.NODE_ENV,'process.env.NODE_ENV') // dev
export default {
......
/*
** Plugins to load before mounting the App
*/
plugins: pluginsValue,
......
}
Mock API 文档
更多推荐




所有评论(0)