目前尚未启用对实验性语法“flow”的支持 (5:8):react/typescript

som*_*one 5 typescript reactjs jestjs babel-jest

我对单元测试非常陌生,每次我修复一件事时,它都会抛出一个新错误,在此之前它说 React 未定义。在此之前它说文档未定义。正如你可以想象的那样,我不得不改变很多不同的事情。有人能告诉我发生了什么事吗?

新的错误正如标题所示 -

export type UsersList = {
        |        ^
      6 |   first: string;
Run Code Online (Sandbox Code Playgroud)

和...

ReferenceError: regeneratorRuntime is not defined

      23 |     setLoading(true);
      24 |
    > 25 |     const fetchList = async (): Promise<UsersList> => {
         |                    ^
      26 |       const result: any = await fetch("https://randomuser.me/api/?results=20")
      27 |         .then((res) => res.json())
      28 |         .then((data) => {
Run Code Online (Sandbox Code Playgroud)

包.json

{
  "name": "template-junior-frontend",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@emotion/react": "^11.7.1",
    "@emotion/styled": "^11.6.0",
    "@fortawesome/fontawesome-svg-core": "^1.3.0",
    "@fortawesome/free-regular-svg-icons": "^6.0.0",
    "@fortawesome/free-solid-svg-icons": "^6.0.0",
    "@fortawesome/react-fontawesome": "^0.1.17",
    "@material-ui/core": "^5.0.0-beta.5",
    "@mui/icons-material": "^5.4.2",
    "@mui/material": "^5.4.2",
    "@testing-library/jest-dom": "^5.16.1",
    "@testing-library/react": "^12.1.2",
    "@testing-library/user-event": "^13.5.0",
    "@types/node": "^16.11.20",
    "@types/react": "^17.0.38",
    "@types/react-dom": "^17.0.11",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-scripts": "5.0.0",
    "react-string-replace": "^0.4.4",
    "regenerator-runtime": "^0.13.9",
    "typescript": "^4.5.4",
    "web-vitals": "^2.1.3"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "jest --watch",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "@babel/preset-typescript": "^7.16.7",
    "@types/jest": "^27.4.0",
    "jest": "jest",
    "jest-environment-jsdom": "^27.5.1",
    "ts-jest": "^27.1.3"
  }
}
Run Code Online (Sandbox Code Playgroud)

笑话配置.ts

import {defaults} from 'jest-config'
module.exports = {
  roots: ["<rootDir>/src"],  
  testEnvironment: 'jsdom',
  moduleFileExtensions: [...defaults.moduleFileExtensions, 'ts', 'tsx'],
  setupFilesAfterEnv: [ require.resolve('regenerator-runtime/runtime') ]
};
Run Code Online (Sandbox Code Playgroud)

babel.config.json

{
    "presets": [
      ["@babel/preset-react", {
        "runtime": "automatic"
     }]
    ]
  }
Run Code Online (Sandbox Code Playgroud)

setupTests.ts

import '@testing-library/jest-dom';
import 'regenerator-runtime/runtime'
Run Code Online (Sandbox Code Playgroud)