有的时候前端开发需要用到假数据，但是mock js 会显得不是很直观，而且自由度不是很好
这里采用了koa的服务器
最后工作流程为：在后端那里要来json文件，通过fs批量require进来，文件名就是变量名，注册到router上。
项目路径如下
image.png
appjs
var Koa = require('koa');
var bodyParser = require("koa-bodyparser")
var cors = require('koa2-cors');
var router = require('./router');
var app = new Koa();
app.use(cors())
.use(router.routes())
.use(router.allowedMethods())
.use(bodyParser())
.listen(3001)
routerjs
var Router = require('koa-router');
var router = new Router({
prefix: '/'
});
var fs = require('fs');
function Module(paths) {
var dirname = require("path").resolve(__dirname)
var modules = {};
var folder = dirname + paths
var files = fs.readdirSync(folder)
files.forEach(function(file) {
var filepath = folder + '/' + file;
let keys = file.split(".")[0]
modules[keys] = require(filepath)
})
return modules
}
let modules = Module("/json")
let routers = [
["table", modules.table],
['api-demo', modules.tree],
['api-demo', modules.login]
]
//全部是post
for (let i of routers) {
router.post(i[0], (ctx, next) => {
ctx.body = i[1]
})
}
function resultJS(data) {
return (ctx, next) => {
ctx.body = {
"success": true,
"message": "操作成功！",
"code": 0,
"result": data
}
}
}
function resultJSON(data) {
return (ctx, next) => {
ctx.body = data
}
}
router.get('api-demo', (ctx, next) => {
ctx.body = `gnvnv`
})
router.post('api-demo', resultJSON({ "success": true, "code": 200, "message": "操作成功", "data": { "dataList": [] } }))
module.exports = router
image.png
js文件是没有接口文档，自己模拟数据来使用的，基本上用不太到。
之后配置packagejson 整合到vue start里面
这里要填2个包
nodemon //server的热更新
concurrently //npm多开任务
image.png
"scripts": {
"dev": "vite",
"server": "nodemon ./_server/app.js",
"start": "concurrently \"npm run server\" \"npm run dev\" ",
"test": "vite build --mode test",
"prod": "vite build --mode prod",
"serve": "vite preview"
},
