reactjs - react-scripts jest 27 版本依赖错误

Question

我想开始使用框架 jest 和酶来测试我的 React 组件。我正在用 Typescript 编写代码。所以我安装了类似的软件包：jest、酵素、enzyme-adapter-react-16、ts-jest 和 typescript 类型所需的依赖项。下面我展示了整个 package.json 文件：

{
  "name": "test-learning-with-redux",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^5.14.1",
    "@testing-library/react": "^11.2.7",
    "@testing-library/user-event": "^12.8.3",
    "@types/node": "^12.20.16",
    "@types/react": "^17.0.14",
    "@types/react-dom": "^17.0.9",
    "node-sass": "^6.0.1",
    "react": "^16.14.0",
    "react-dom": "^16.14.0",
    "react-scripts": "4.0.3",
    "web-vitals": "^1.1.2"
  },
  "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": {
    "@types/enzyme": "^3.10.9",
    "@types/enzyme-adapter-react-16": "^1.0.6",
    "@types/jest": "^26.0.24",
    "enzyme": "^3.11.0",
    "enzyme-adapter-react-16": "^1.15.6",
    "enzyme-to-json": "^3.6.2",
    "jest": "^27.0.6",
    "jest-enzyme": "^7.1.2",
    "ts-jest": "^27.0.3",
    "typescript": "^4.3.5"
  }
}

问题是安装后依赖项测试工作正常，但反应服务器不起作用。我可以在下面的屏幕上观察到错误：

当然我可以通过添加 .env 来解决这个问题：SKIP_PREFLIGHT_CHECK=true 并且它可以工作，但我不确定它是否是最好的解决方案。

另一方面，如果我通过键入npm uinstall jest删除与 jest 的依赖关系，则 jest 将不起作用并且会出现错误：TypeError: Jest: a transform must export a processfunction。更多在下面的屏幕上：

下面我展示 jest.config.js 配置文件：

My module.exports = {
    "roots": [
        "<rootDir>/src"
    ],
    "transform": {
        "^.+\\.tsx?$": "ts-jest"
    },
    "testRegex": "(/__tests__/.*|(\\.|/)(test|spec))\\.tsx?$",
    "moduleFileExtensions": [
        "ts",
        "tsx",
        "js",
        "jsx",
        "json",
        "node"
    ],
    "snapshotSerializers": ["enzyme-to-json/serializer"],
    "setupFilesAfterEnv": ["<rootDir>/src/setupEnzyme.ts"],
}

为了同时使用 jest 和 typescript 正常工作，解决这个问题的最佳方法是什么？我可以观察到一些评论，人们写了关于通过react-scripts强制从不版本，但我不知道该怎么做。也许最好保留来自react-scripts的版本并以某种方式解决我上面提到的jest中的TypeError但是如何？

我会很高兴得到建议和介词。

标签： reactjstypescriptjestjs