react-cli中加入mockjs

104 阅读1分钟

配置代理

安装http-proxy-middleware,并在src目录下增加setupProxy.js文件,加入代码

const {createProxyMiddleware} = require("http-proxy-middleware");

module.exports = function(app) {
    app.use(createProxyMiddleware('/mock',{
        "target": "http://127.0.0.1:3001",  // 端口号根据需要设置
        "changeOrigin": true
    }))
}

模拟后台

通过json server

参考json-server结合mockjs模拟REST API(react)

通过node

这里使用的是express,简单实现了一下,在s

let express = require("express")
let Mock = require("mockjs");

let server = express();

server.use("/mock/test", function(req,res) {
    res.json(Mock.mock({
        "status": 200,
        "msg": "",
        "data|1-100": [
            {
                "id|+1": 0,
                "title|1-9": "这是一段不长不短的文字"
            }
        ]
    }))
})

server.listen("3001", () => {
    console.log("3001端口已启动");
})

配置启动项

package.json文件,在script中加入

"mock": "node src/mock/express.js",
"mockdev": "npm start & npm run mock"