使用 Jest 进行 Vue 单元测试

vue-cli3 的插件使安装流程变得格外简单，通过 vue ui 启动可视化管理系统，在插件栏，点击 ‘添加插件’，搜索 @vue/cli-plugin-unit-jest，点击安装就可以了，对应命令行的 vue add @vue/cli-plugin-unit-jest 命令；这个过程实际上是包含了安装和调用两个步骤，并且会把相关的依赖一并安装进来，这样就不需要自己一个一个的安装每个依赖了。

在根目录会发现新生成了一个 test 文件夹，里面有一个 .spec.js 后缀的示例文件，用 packgae.json 里的 test:unit 指令直接运行，就可以调用 jest 的测试了，系统会匹配所有 .spec.js 或者 .test.js 后缀的文件并执行期中的代码.

表格里的是关于代码覆盖率的指标，默认是关闭的，需要在jest.config.js 中配置下，

  preset: '@vue/cli-plugin-unit-jest',
  "collectCoverage": true,
  "collectCoverageFrom": ["**/*.{js,vue}", "!**/node_modules/**"]

执行下 npm run test:unit 看下效果