前言
很多小夥伴問我怎麼在自己公司的專案裡面新增配置mock,在vue專案裡面都知道怎麼配置mock,在大型前端專案裡面就一臉疑惑了。
我就回答他,你今天會在vue專案裡面用,那天換公司是用angular、react,webix...等等
還是不會配置使用mock,就推薦用easymock, 所有前端專案都可以用管你啥jb框架,統統都搞定ojbk。就有人問了,easymock,為啥要本地部署啊,線上用不行嗎?(當然行,你說啥都是對的)
原因有下
- 1 easymock官網常掛,導致開發進展停止(完不成任務就等著加班吧)
- 2 有小夥伴們是外包公司,不能用外網(mmp外網都沒有,我怎麼谷歌程式設計?)
- 3 萬一那天easymock把你們的重要等資訊丟失了(你告他也麼有用)
快速開始(去幼兒園的車要發車了,快上車系好安全帶)
在開始之前,假設你已經成功安裝了 Node.js(>= v8.9)& MongoDB(>= v3.4)& Redis(>= v4.0)。
MongoDB安裝教程:www.runoob.com/mongodb/mon…
Redis安裝教程:www.runoob.com/redis/redis…
tips小提示
- node.js和mongodb安裝的時候一般一直next下去就可以了。
- redis下載下來是壓縮包,解壓就行了
檢查是否安裝成功
- node.js能用npm就成功了,或者輸出node版本
- mongodb 找到安裝後的資料夾(一般預設是在
C:\Program Files\MongoDB\Server\4.0\bin
裡面),雙擊mongo.exe輸入db回車顯示test資料庫就成功了 - redis檢查是否成功看上面的安裝教程就有非常簡單的。
安裝
$ git clone https://github.com/easy-mock/easy-mock.git
$ cd easy-mock && npm install
複製程式碼
配置檔案
找到 config/default.json,或者建立一個 config/local.json 檔案,將如下需要替換的欄位換成自己的配置即可。(預設是不需要修改配置檔案的)
不同環境會載入不同的配置檔案,在此之前你應該對 node-config 有所瞭解。
{
"port": 7300,//easymock專案啟動的埠
"host": "0.0.0.0",
"pageSize": 30,
"proxy": false,
"db": "mongodb://localhost/easy-mock",// 不需要自己新建資料庫,在啟動的easymock新建介面即可
"unsplashClientId": "",
"redis": {
"port": 6379,//redis埠
"host": "localhost"
},
"blackList": {
"projects": [], // projectId,例:"5a4495e16ef711102113e500"
"ips": [] // ip,例:"127.0.0.1"
},
"rateLimit": { // https://github.com/koajs/ratelimit
"max": 1000,
"duration": 1000
},
"jwt": {
"expire": "14 days",
"secret": "shared-secret"
},
"upload": {
"types": [".jpg", ".jpeg", ".png", ".gif", ".json", ".yml", ".yaml"],
"size": 5242880,
"dir": "../public/upload",
"expire": {
"types": [".json", ".yml", ".yaml"],
"day": -1
}
},
"fe": {
"copyright": "",
"storageNamespace": "easy-mock_",
"timeout": 25000,
"publicPath": "/dist/"
}
}
複製程式碼
啟動
$ npm run dev
# 訪問 http://127.0.0.1:7300
複製程式碼
這個時候我們隨便開啟一個介面預覽,複製url用postman測試介面ok
更多的需求配置,詳情看官網文件,我就不多一 一說了。
Vue學習群493671066,美女多多。老司機快上車,來不及解釋了。