easy-mock 本地部署(擠需體驗三番鍾,裏造會幹我一樣,愛象節款mock)

前言

很多小夥伴問我怎麼在自己公司的項目裏面添加配置mock,在vue項目裏面都知道怎麼配置mock,在大型前端項目裏面就一臉疑惑了。
loEv-hikcahh3016251.jpg

我就回答他,你今天會在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安裝教程:http://www.runoob.com/mongodb/mongodb-window-install.html

Redis安裝教程:http://www.runoob.com/redis/redis-install.html

tips小提示

  • node.js和mongodb安裝的時候一般一直next下去就可以了。
  • redis下載下來是壓縮包,解壓就行了

檢查是否安裝成功

  • node.js能用npm就成功了,或者輸出node版本
  • mongodb 找到安裝後的文件夾(一般默認是在C:\Program Files\MongoDB\Server\4.0\bin裏面),雙擊mongo.exe輸入db回車顯示test數據庫就成功了
    db.png
  • 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

run.png

這個時候我們隨便打開一個接口預覽,複製url用postman測試接口ok

mock.png

更多的需求配置,詳情看官網文檔,我就不多一 一說了。

Vue學習羣493671066,美女多多。老司機快上車,來不及解釋了。

作者相關Vue文章

基於Vue2.0實現後臺系統權限控制

vue2.0-基於elementui換膚[自定義主題]

前端文檔彙總

VUE2.0增刪改查附編輯添加model(彈框)組件共用

打賞 衷心的表示感謝

打賞

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章