0.0.1 • Published 1 year ago
@tzxhy/vite-generate-mock v0.0.1
@tzxhy/vite-generate-mock
根据 swagger.json
文档,创建 vite-plugin-mock
所用的 ts 文件。
安装
yarn add @tzxhy/vite-generate-mock -D
使用
创建自定义文件,如:
// scripts/generate-mock.js
// 用于生成mock结构
/* eslint-disable */
const path = require('path');
const fs = require('fs');
const generate = require('@tzxhy/vite-generate-mock').default;
let customJsonConf = {};
try {
customJsonConf = require('../mock/custom-mock-conf');
} catch(e) {
console.log('如果需要自定义代理,创建 mock/custom-mock-conf.js 文件内容如:' + `
module.exports = {
'/v1/mec/device/create_sensor': {
url: '/api/mec/device/create_sensor_new',
method: 'post',
response: () => ({
errCode: 0,
errMsg: 'success',
errDetail: Random.string(),
data: {
rsuSerial: Random.string(),
},
}),
},
};`);
}
const customInterfaceKeys = Object.keys(customJsonConf);
const mockCodes = generate({
fileHeader: '',
// 指定 swagger.json 文件地址
apiPath: path.join(__dirname, '..', 'swagger', 'api.swagger.json'),
apiPathRewrite(apiPath) {
return apiPath.replace('/v1', '/api');
},
// api 替换,使用自定义的内容
apiReplace(apiPath) {
if (customInterfaceKeys.includes(apiPath)) {
return this.returnObj(customJsonConf[apiPath]);
}
},
// this 绑定了辅助函数;apiPath为接口地址;curveKeyName为key名称;curveLevel为嵌套级别。从1开始。
// apiPath 为转换前的path
responseAdapter(apiPath, curveKeyName, curveLevel) {
if (curveKeyName === 'totalPages') {
return this.createNumberLiteral(100);
}
if (curveKeyName === 'count') {
return this.createNumberLiteral(10000);
}
if (curveKeyName === 'id') {
return this.createRandomNumber(1, 1000);
}
if (curveKeyName === 'alertingNum'
|| curveKeyName === 'totalAlerting'
|| curveKeyName === 'totalErrors'
|| curveKeyName === 'totalHistoryErrors'
|| curveKeyName === 'totalHistoryAlerting'
) {
return this.createRandomNumber(1, 200);
}
if (curveKeyName === 'keepingTime') {
return this.createRandomNumber(1000 * Math.floor(Math.random() * 1e3), 1e8);
}
if (curveKeyName === 'timestamp') {
return this.createStringLiteral(new Date().valueOf() + '')
}
if (curveKeyName === 'errCode') {
return this.createNumberLiteral(0);
}
if (curveKeyName === 'errMsg') {
return this.createStringLiteral('success');
}
}
});
// 产物地址
const mockDest = path.join(__dirname, '..', 'mock', 'api.ts');
fs.writeFileSync(mockDest, mockCodes);
console.log('mock源文件已生成至: ' + mockDest);
配置 package.json
:
{
"scripts": {
"start-with-mock": "yarn typings && yarn generate-mock && vite --open --mode mock",
"generate-mock": "node scripts/generate-mock",
"typings": "other things"
}
}
配置 vite.config.js
,如下:
import {
defineConfig,
} from 'vite';
import {
viteMockServe,
} from 'vite-plugin-mock';
export default defineConfig((env) => {
const plugins = [];
if (env.mode === 'mock') {
console.log('use mock server...');
// mock plugin
plugins.push(
viteMockServe({
mockPath: 'mock',
localEnabled: true,
}),
);
// scripts/generate-mock.js 文件地址
const mockGenerate = path.join(__dirname, 'scripts', 'generate-mock.js');
// 文件更新,那么重新生成mock数据
fs.watch(mockGenerate, () => {
childProcess.exec('node ' + mockGenerate, (err, std) => {
console.log(std);
});
});
// 自定义文件更新,同样触发更新
try {
const customMock = path.join(__dirname, 'mock', 'custom-mock-conf.js');
fs.watch(customMock, () => {
childProcess.exec('node ' + mockGenerate, (err, std) => {
console.log(std);
});
});
} catch (error) {
console.log('watch custom mock error', '\n', error);
}
return {
plugins,
// ... other configs
}
})
然后开启 mock 开发
即可: yarn start-with-mock
。
0.0.1
1 year ago