vite2配置mockjs

3,529 阅读1分钟

这篇文章属于vite2踩坑

附上文档参考链接

要求版本

node版本 >= 12.0.0

vite版本 >= 2.0.0

安装前置依赖

npm i mockjs -S
npm i vite-plugin-mock -D
npm i cross-env -D

package.json配置script > dev

"dev": "cross-env NODE_ENV=development vite"

vite.config.ts

import { viteMockServe } from 'vite-plugin-mock'

plugins: [vue(),viteMockServe({mockPath: './mock'})],

supportTs: true是否用了ts,可以根据自己选择true or false

在与node_modules同级目录建立mock目录

目录下建立mock文件 user.ts

import { MockMethod } from 'vite-plugin-mock'
export default [
    {
        url: '/api/getUser',
        method: 'get',
        response: () => {
            console.log('body>>>>>>>>')
            return {
                code: 0,
                message: 'ok',
                data: ['aa', 'bb']
            }
        }
    }
] as MockMethod[]

代码请求

axios.get('/api/getUser').then(res => {
      console.log(res)
})

这里就配置完成了

注意

在macOSx里面会出现一个Bug

版本: macOS Big Sur 11.2.3

npm: 7.11.1

这里会报一个服务无法启动的错误,导致mock server起不来

在package-lock.json里面修改

"hasInstallScript": true,
"lockfileVersion": 1,

再npm run dev问题解决