reactjs - package.json 中的 Jest 配置失败

Question

您好，这是我第一次使用 Jest。我正在尝试将其配置为与 Enzyme 和 webpack 一起使用。我将此添加到我的 package.json 文件中进行测试：

"scripts": {
    "test": "jest",
    "test:watch": "jest --watch",
  }

和开玩笑的配置：

"jest": {
    "setupTestFrameworkScriptFile": "<rootDir>_tests_/setup/setupEnzyme.js",
    "testPathIgnorePatterns": [
      "<rootDir>/_tests_/setup/"
    ],
    "verbose": true
  }

这是我的 setupEnzyme 文件：

import Enzyme from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';

Enzyme.configure({ adapter: new Adapter() });

但我得到错误Module <rootDir>_tests_/setup/setupEnzyme.js in the setupTestFrameworkScriptFile option was not found.

标签： reactjsconfigurationpackagejestjsenzyme

Answer 1

这是package.json我的一个使用 jest 的项目。我有一个src和test文件夹在同一级别。与您不同，我setupFiles在jest.package.json

{
  "name": "app",
  "version": "1.0.0",
  "description": "App",
  "main": "index.js",
  "scripts": {
    "start": "webpack-dev-server --colors --mode=development",
    "build": "webpack --mode=production",
    "test": "jest",
    "test:watch": "jest --watch",
    "test:coverage": "jest --coverage"
  },
  "jest": {
    "setupFiles": [
      "./test/jestsetup.js"
    ],
    "snapshotSerializers": [
      "enzyme-to-json/serializer"
    ],
    "moduleNameMapper": {
      "\\.(css|less)$": "identity-obj-proxy"
    }
  },
  "keywords": [
    "react"
  ],
  "license": "MIT",
  "devDependencies": {
    "babel-jest": "^23.2.0",
    "babel-loader": "^7.1.3",
    "babel-preset-env": "^1.6.1",
    "babel-preset-react": "^6.24.1",
    "babel-preset-stage-2": "^6.24.1",
    "css-loader": "^0.28.11",
    "enzyme": "^3.3.0",
    "enzyme-adapter-react-16": "^1.1.1",
    "enzyme-to-json": "^3.3.4",
    "identity-obj-proxy": "^3.0.0",
    "jest": "^23.2.0",
    "react-test-renderer": "^16.4.1",
    "style-loader": "^0.21.0",
    "webpack": "^4.6.0",
    "webpack-cli": "^2.0.15",
    "webpack-dev-server": "^3.1.3"
  },
  "dependencies": {
    "react": "^16.3.2",
    "react-dom": "^16.3.2"
  }
}  

这里是jestsetup.js

import Enzyme, { shallow, render, mount } from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';
// React 16 Enzyme adapter
Enzyme.configure({ adapter: new Adapter() });