Jest 没有解析导入文件

Question

我正在尝试使用 Jest 和 Enzyme 测试我的 Next.js 项目。当我尝试从我的组件导入一个文件来测试它时，尽管抛出错误。这是我的文件...

在package.json我的jest配置是：

 "jest": {
"setupFilesAfterEnv": "<rootDir>/jest.setup.js",
"testPathIgnorePatterns": [
  "<rootDir>/.next/",
  "<rootDir>/node_modules/"
],
"transform": {
  "\.(gql|graphql)$": "jest-transform-graphql",
  ".*": "babel-jest",
  "^.+\.js?$": "babel-jest"
}


 },

  "//": "I prefer this over a .babelrc file",
  "babel": {
    "env": {
      "development": {
        "presets": [
          "next/babel"
        ],
        "plugins": [
          [
            "styled-components",
            {
              "ssr": true,
              "displayName": true
            }
          ]
        ]
      },
      "production": {
        "presets": [
          "next/babel"
        ],
        "plugins": [
          [
            "styled-components",
            {
              "ssr": true,
              "displayName": true
            }
          ]
        ]
      },
      "test": {
        "presets": [
          [
            "next/babel",
            {
              "preset-env": {
                "modules": "commonjs"
              }
            }
          ]
        ],
        "plugins": [
          [
            "styled-components",
            {
              "ssr": true,
              "displayName": true
            }
          ]
        ]
      }
    }
  }

随后在 jest.setup.js 中：

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

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

但是我每次想要**导入文件时总是会遇到这个错误 **（在这里例如我尝试导入一个文件即"import ItemComponent from '../components/Item';"） :

Jest encountered an unexpected token

This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript.

By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules". SyntaxError: Unexpected identifier

详情：

SyntaxError: C:\Users\Welcome\Desktop\Advanced-React-master\sick-fits\frontend\__tests__\Item.test.js: Unexpected token (20:28)

  18 | describe('<Item/>', () => {
  19 |   it('renders and matches the snapshot', () => {
> 20 |     const wrapper = shallow(<ItemComponent item={fakeItem} />);
     |                             ^
  21 |     expect(wrapper).toMatchSnapshot();
  22 |   });
  23 |   // it('renders and displays properly', () => {

  at Parser.raise (node_modules/@babel/parser/lib/index.js:3939:15)
  at Parser.unexpected (node_modules/@babel/parser/lib/index.js:5248:16)
  at Parser.parseExprAtom (node_modules/@babel/parser/lib/index.js:6328:20)
  at Parser.parseExprSubscripts (node_modules/@babel/parser/lib/index.js:5924:21)
  at Parser.parseMaybeUnary (node_modules/@babel/parser/lib/index.js:5903:21)
  at Parser.parseExprOps (node_modules/@babel/parser/lib/index.js:5812:21)
  at Parser.parseMaybeConditional (node_modules/@babel/parser/lib/index.js:5784:21)
  at Parser.parseMaybeAssign (node_modules/@babel/parser/lib/index.js:5731:21)
  at Parser.parseExprListItem (node_modules/@babel/parser/lib/index.js:6995:18)
  at Parser.parseCallExpressionArguments (node_modules/@babel/parser/lib/index.js:6124:22)

如有任何帮助，我们将不胜感激

Answer 1

尝试从 package.json:

中删除这两行

  ".*": "babel-jest",
  "^.+\.js?$": "babel-jest"

理论上，不需要这些：https://jestjs.io/docs/en/configuration#transform-objectstring-pathtotransformer--pathtotransformer-object

您添加的自定义配置可能会导致问题。理论上，jest 应该默认使用 babel-jest 转换您的 js 文件。我肯定有一个最近的 NextJS 项目与 jest 一起工作，在我的 package.json.

中没有声明 babel-jest 配置

Jest 没有解析导入文件

Jest didn't parse to import a file

jestjs

enzyme

next.js