测试 React API - 意外的令牌错误

Testing React API - Unexpected Token error

我有一个使用 create-react-app 创建的基本 React 应用程序。我正在尝试开始 Pact to do contract testing on my API using the Javascript implementation guide.

我完全按照上面 link 中的步骤进行了操作,并创建了一个基本测试,它基本上什么都不做,只是为了让测试达到 运行:

import { Pact } from '@pact-foundation/pact';

it('works', () => {
  expect(1).toEqual(1);
});

当 运行ning npm run pactTest 我得到以下错误:

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".

Here's what you can do:
 • To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
 • If you need a custom transformation specify a "transform" option in your config.
 • If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.

You'll find more details and examples of these config options in the docs:
https://jestjs.io/docs/en/configuration.html

Details:

/path/to/file.test.pact.js:1
({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){import { Pact } from '@pact-foundation/pact';
                                                                                                ^

SyntaxError: Unexpected token {

  at ScriptTransformer._transformAndBuildScript (node_modules/jest-runtime/build/script_transformer.js:403:17)

如果我将导入行更改为:const Pact = require('@pact-foundation/pact'); 那么它就可以工作了。

问题是我不能使用 require 而不是 import 除了这个虚拟示例之外的任何东西,因为我在整个 React 中使用 import项目。

我肯定还缺少其他东西,因为 Javascript implementation guide 使用 import { Pact } from '@pact-foundation/pact';

在 jest.config.js

中的转换对象之后添加以下配置
  '^.+\.js$': 'babel-jest

以下是您的参考示例

  module.exports = {
     moduleFileExtensions: ['js', 'jsx', 'json', 'vue'],
     transform: {
         '.+\.(css|styl|less|sass|scss|png|jpg|ttf|woff|woff2)$':
         'jest-transform-stub',
         '^.+\.(js|jsx)?$': 'babel-jest'
     },
     moduleNameMapper: {
         '^@/(.*)$': '<rootDir>/src/'
     },
     snapshotSerializers: ['jest-serializer-vue'],
        testMatch: [
            '<rootDir>/(tests/unit/**/*.spec.(js|jsx|ts|tsx)|**/__tests__/*.(js|jsx|ts|tsx))'
     ],
     transformIgnorePatterns: ['<rootDir>/node_modules/']
  };