官方测试工具
提供特定的方法，在隔离的环境下，进行组件的挂载，以及一系列的测试

配置开发环境

  • 手动配置：非常复杂。
  • vue cli 是基于插件架构的，插件可以
    • 安装对应的功能依赖
    • 修改内部配置
    • 注入命令

比如在package.json文件看到的下面两个是babel和eslint插件。

  1.     "@vue/cli-plugin-babel": "^4.5.0",
  2.     "@vue/cli-plugin-eslint": "^4.5.0",
  • 在现有项目中安装插件
    • vue add 插件名称

  • 测试插件有以下2种

    • （下载量大，更推荐）

    • 插件运作的过程

  • 安装的依赖

    • vue-test-utils
    • vue-jest
    • 注入了新的命令
  • vue-cli-serveice test:unit
    • Any files in tests/unit that end in .spec.( js |jsx| ts| tsx)
    • Any js(x)/ts(x) files inside__tests__ directories
  • vue-jest 转换
    • 将vue SFC格式文件转换成对应的ts文件
    • 将ts通过presets/typescript-babel转换成对应的js文件
      1. module.exports = {
      2. preset: '@vue/cli-plugin-unit-jest/presets/typescript-and-babel',
      3. transform: {
      4. '^.+\\.vue$': 'vue-jest'
      5. }
      6. }

      启动测试

      package.json 添加脚本命令
      1. "test:unit": "vue-cli-service test:unit",
      终端执行命令
      1. yarn test:unit -- --watch