Vue-cli3 Jest单元测试

本文介绍：
1、初始化未选择安装test模块的vue-cli3项目下jest环境的搭建
2、vue组件基本的测试方法

1.环境配置

1.1安装Test-unit依赖

npm install --save-dev @vue/test-utils

1.2安装Jest依赖

vue add @vue/cli-plugin-unit-jest

1.3安装babel-jest、vue-jest和babel-core

npm install --save-dev babel-jest vue-jest babel-core@7.0.0-bridge.0

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

1.4 package.json配置

在scripts中加入测试命令

"scripts": {
   
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "test:unit": "vue-cli-service test:unit",
    "lint": "vue-cli-service lint"
},

2.测试

2.1测试组件

HelloWorld.vue

<template>
  <div>
    <