viteThe use ofjest

  • nodeVersion: v14.17.3
  • yarn: 1.22.10
  • vite: 2.5.20
  • Preferred to useyarnInstall dependencies

  1. Vite creates the project

    NPM init vite # select vue vue-ts # Download dependency runCopy the code

  1. Creating the Tests folder

    // mkdir tests -> touch test.spec.ts import { add } from '.. / utils/tools' go in (' 1 + 1, () = > {it (' 1 + 1 = 2, () = > {expect (add (1, 1)). The place (2)})})Copy the code

  1. New utils

    // mkdir utils -> touch tools.ts
​
function add(a: number, b: number): number{
  return a + b
}
​
export {
  add
}
Copy the code

  1. Installing dependencies

    Yarn add @babel/core @babel/preset-env -d # Support TS file YARN add @babel/preset-typescript -d # babel-jest yarn add babel-jest -d # Install jest dependencies yarn add jest ts-jest vue-jest @types/jest @vue/test-utils -d # Ts-jest TS file JEST supported # VUe-jest Vue file Supported # @types/jest type declaration file # @vue/test-utils yarn add [email protected] [email protected] [email protected] -d # Fixed versionCopy the code

  1. Package. The json configuration

    {
  ...
  "scripts": {
    "test": "jest"
  },
  "jest": {
    "transform": {
      "^.+\.[t|j]sx?$": "babel-jest"
    }
  },
  ...
}
Copy the code

  1. tsconfig.json

    {... "types": ["vite/client", "jest"] }Copy the code

  1. New jest. Config. Js

    Module. Exports = {testMatch: [" * * /? (*) + (spec | test | unit). [jt] s? (x) "/ / matching test file], the transform: {" ^. + \. [j] | t sx? $": "babel-jest", "^.+\.vue? $": "vue-jest", "^.+\.tsx$": "ts-jest" } }Copy the code

  1. To build Babel. Config. Json

    {"presets": [["@babel/preset-env"], "@babel/preset-typescript"]}Copy the code

\