再过一周，我就在我厂待满三年了。其实我的职业生涯还算比较顺利，除了第一次跳槽不太好，后面每个公司都选的不错，虽然远不能满足财务自由的梦想，但是几乎都能让我在技术上有所精进，在职业上也取得一定成长。
三年期间，我们做了不少产品，为了方便在不同产品之间复用代码，我把一些公共部分抽出来做成组件，独立开发和维护，并且通过 npm + GitHub Registry 管理依赖（这个部分，前面曾写过一篇文章《使用 GitHub Registry 托管私有 NPM 源》介绍）。
有一些组件，比如登录，独立出来开发没问题，但是测试比较难搞，为了它单独开发服务器有点太兴师动众。所幸我很快就找到 webpack-mock-server，它可以很方便的定义 API 接口，只要把它加到项目中，就能很容易的完成测试了。
使用方法
1. 安装
使用 npm 安装，并且添加配置文件。安装 typescript 是因为它默认会在项目根目录里找 webpack.mock.ts，我暂时不知道怎么不用 ts 写配置。
npm install -D webpack-mock-server typescript
const webpackMockServer = require("webpack-mock-server");
module.exports = {
devServer: {
before: webpackMockServer.use
}
}2. 配置接口
目前这个工具只会在根目录里找 webpack.mock.ts（或者说我用的还不太熟，只会这么做），好在写 express 配置并不复杂，也不需要 ts 语法：
import webpackMockServer from "webpack-mock-server";
// app is expressjs application
export default webpackMockServer.add((app, helper) => {
// you can find more about expressjs here: https://expressjs.com/
app.get("/testGet", (_req, res) => {
res.json("JS get-object can be here. Random int:" + helper.getRandomInt());
});
app.post("/testPost", (_req, res) => {
res.json("JS post-object can be here");
});
});3. 检查接口
接下来，正常启动 dev-server 即可：webpack-dev-server --config=build/webpack.dev.js，然后留心控制台，会多输出一个服务网址，比如：
WebpackMockServer. Started at http://localhost:8079/这个服务一般是 dev-server 端口 -1，比如我的 dev-server 跑在 8080，那么它就在 8079。打开之后是如下所示的接口列表：
从中可以看到所有提供服务的接口，支持什么方法，点击还能查看返回结果，非常方便。
总结
使用这个工具，可以大大提升组件库的开发效率。目前我用的也不是很熟，文档中介绍的方法还没用完，也不清楚怎么不用 ts。先推荐给大家吧。
