时间戳

首页 > 解决方案 > Jest 和 ES6 语法的问题

javascript - Jest 和 ES6 语法的问题

问题描述

我有两个测试文件都使用import. 其中一个通过，另一个抛出错误：

node_modules/@storybook/addon-docs/blocks.js:1
    ({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,jest){import deprecate from 'util-deprecate';
                                                                                      ^^^^^^

    SyntaxError: Cannot use import statement outside a module

    > 1 | import { DocsPage, DocsContainer } from '@storybook/addon-docs/blocks';

我的 Jest 配置如下：

module.exports = {
  collectCoverageFrom: ['**/*.{js,jsx,ts,tsx}', '!**/*.d.ts', '!**/node_modules/**'],
  coverageThreshold: {
    global: {
      branches: 80,
      functions: 80,
      lines: 80,
      statements: -10,
    },
  },
  moduleNameMapper: {
    '^@app/(.*)$': '<rootDir>/$1',
    '^@components/(.*)$': '<rootDir>/components/$1',
    '^@graphql/(.*)$': '<rootDir>/graphql/$1',
    '^@lib/(.*)$': '<rootDir>/lib/$1',
  },
  setupFilesAfterEnv: ['<rootDir>/jest.setup.js'],
  testPathIgnorePatterns: [
    '<rootDir>/node_modules/',
  ],
  transform: {
    '^.+\\.(js|jsx|ts|tsx)$': ['babel-jest', { presets: ['next/babel'] }],
  },
  transformIgnorePatterns: ['/node_modules/'],
};

我对一个文件可以正常运行而另一个文件不能正常运行感到完全困惑。如果有人能指出我正确的方向，那将不胜感激。

标签： javascriptjestjsts-jestbabel-jest

解决方案

Jest 27.xx 的实施变得更加严格。

当我使用 markdown npm 包时，我遇到了类似的情况。

尝试改变：

transformIgnorePatterns: ['/node_modules/'],

至：

transformIgnorePatterns: ['<rootDir>/node_modules/', '<rootDir>/node_modules/util-deprecate'],

Jest 在他们的网站上有这个，他们解释了这个问题是如何出现的。

以下是逐字复制问题的解释，其中突出显示了重要部分：

有时会发生（尤其是在 React Native 或 TypeScript 项目中）第 3 方模块发布为untranspiled。由于默认情况下 node_modules 中的所有文件都没有进行转换，因此Jest 将无法理解这些模块中的代码，从而导致语法错误。为了克服这个问题，您可以使用transformIgnorePatterns允许转译此类模块。

推荐阅读