vue 项目jest单元测试 并生成测试报告

1. 项目基于cli4 搭建

2. 一开始没有按照脚手架指示安装单元测试，如何后添加呢？

3. 最终结果如下图，可以看到覆盖率，并且生成html的测试报告

4. 实现步骤

（1）如果使用脚手架搭建新项目，搭建项目的时候选 Unit Testing --> jest就可以了

然后在jest.config.js中添加如下代码

module.exports = {

    preset: '@vue/cli-plugin-unit-jest',

    "collectCoverage": true,

    "collectCoverageFrom": [

        "src/**/*.{js,vue}"

    ],

    "moduleFileExtensions": [

        "js",

        "jsx",

        "json",

        "vue"

    ]

}

（2）如果是老项目，需要添加单元测试，修改package.json，然后npm install 。把tests文件夹和jest.config.js拷贝过来即可，这俩文件下载地址，暂时没通过审核，等审核通过，在我主页就能看到啦。