目录

在vue3ts项目中使用jest单元测试

目录

在vue3+ts项目中使用jest单元测试

1、 在创建项目的时候可以直接选择带有jest的一项然后可以直接在tests里面编写我们的ts文件

然后再npm run unit:test即可

2、 当我们在创建的时候没选择jest该怎么办呢

首先需要的项目依赖

npm i -S @vue/cli-plugin-unit-jest vue-jest @vue/test-utils

如果是ts项目,需要额外添加 ts-jest @types/jest 安装包

2在根目录新建jest.config.js 文件,配置如下

module.exports ={

preset:’@vue/cli-plugin-unit-jest/presets/typescript-and-babel’,

}

然后在tsconfig.json中的types选项中新增jest选项

“types”: [

“jest”

],

接下来在我们的package.json里添加 “test”: “jest”

下面上个案例吧!

首先我编写了一个改变我们数组的函数

https://i-blog.csdnimg.cn/blog_migrate/70fbfd9a5724f33f3bba785c78677e5d.png

然后在我们跟目录下创建test/unit文件夹

我编写了一个arr.test.ts

https://i-blog.csdnimg.cn/blog_migrate/c4748cc43fc1aa8f0af38d673181adc1.png

接下来使用npm run jest去测试它

https://i-blog.csdnimg.cn/blog_migrate/a35d17ca4de5c2458c73b635be9fef61.png

这样我们就已经成功的在我们项目里使用jest了!