import { viteMockServe } from 'vite-plugin-mock'
viteMockServe({
localEnabled: command === 'serve',
}),
类型“{ localEnabled: boolean; }”的参数不能赋给类型“ViteMockOptions”的参数。
对象字面量只能指定已知属性,并且“localEnabled”不在类型“ViteMockOptions”中。
确实没有这个选项了
viteMockServe Options
{
mockPath?: string;
ignore?: RegExp | ((fileName: string) => boolean);
watchFiles?: boolean;
enable?: boolean;
ignoreFiles?: string[];
configPath?: string;
}
其中开关在enable这里:可以找一个相对详细的教程跟着走
https://blog.csdn.net/weixin_42067720/article/details/115579817
在项目中创建mock文件夹并新建文件test.js
const Mock = require("mockjs")
let id =Mock.mock("@id")
console.log(id)
let obj = Mock.mock({
id:"@id()", //随机id
username:"@cname()", //随机用户名
date:"@date()", //随机日期
avatar:"@image('200x200','red','#fff','avatar')", //随机头像
description:"@paragraph()", ////随机描述
ip:"@ip()" //随机ip地址
email:"@email()" //随机邮箱
})
console.log(obj)
终端输出 node test
进行测试(非热更新方式)
node热更新插件为nodemon
yarn add nodemon / npm install -g nodemon
使用方式
nodemon index
我该如何在Vue3中正确使用Mock?
在Vue3中使用Mock可以通过如下步骤实现:
npm install mockjs
npm install axios --save
npm install json5 --save-dev(可以不要)
import Mock from 'mockjs'
Mock.mock('/api/goodslist','get',{
status:200,
message:'获取商品列表成功!',
'data|5-20':[{
id:'@increment(1)',
name:'@cword(2,8)',
price:'@natural(2,5)',
count:'@natural(100,999)',
img:'dataImage(300x300)',
}]
})
可以将Mock封装在Vue项目中,使用axios的mock数据来模拟数据。
对Mock生成的数据进行重组。
对Mock生成的数据进行参数可变的处理。
详细实现方法请参照参考资料提供的代码和步骤。
viteMockServe({
localEnabled: command === 'serve',
} as any),