typescript - Jest 不会转换模块 - SyntaxError : Cannot use import statement outside a module

原文 标签 typescript jestjs babel-jest ts-jest

我无法摆脱这个 SyntaxError: Cannot use import statement outside a module无论我尝试了什么,都会出错,这让我非常沮丧。有没有人在这里解决这个问题?我已经阅读了一百万个 stackoverflow 和 github 问题线程。没有明确的解决方案。

这是一个 React、Typescript、Webpack 项目。我正在尝试测试一个模块。但是 Jest 不会改变 模块到纯 javascript 不知何故。

我得到的错误是

/Users/me/dev/Project/project/node_modules/variables/src/variables.js:12
    import './main.js';
    ^^^^^^

    SyntaxError: Cannot use import statement outside a module

      17 | 
      18 | */
    > 19 | import { GlobalVars } from 'variables'
         | ^
      20 | 
      21 | export const Vars = new GlobalVars()
      22 | 

我试图解决这个问题(但没有奏效):
  • 使用 env设置在 babel.config : env.test.preset: ['@babel/plugin-transform-modules-commonjs']
  • 修改transform在 Jest 配置中设置为 '^.+\\.jsx?$': 'babel-jest', '^.+\\.tsx?$': 'ts-jest'以及围绕此的所有其他可能性。
  • 在 Jest 配置中,testPathIgnorePatterns , transformIgnorePatterns
  • 使用 .babel.config.js而不是 .babelrc.js

  • ...和更多。

    我有这个设置:

    包.json
      "jest": {
        "preset": "ts-jest",
        "testEnvironment": "node"
      }
    

    .babelrc.js

    module.exports = {
      presets: [
        ['@babel/preset-env', { targets: { node: 'current' } }],
        '@babel/preset-react',
        '@babel/preset-typescript',
      ],
      plugins: [
        '@babel/plugin-transform-runtime',
        '@babel/proposal-class-properties',
        '@babel/transform-regenerator',
        '@babel/plugin-transform-template-literals',
        'react-hot-loader/babel',
      ],
    }
    

    变量.ts

    import { GlobalVars } from 'variables'
    
    export const Vars = new GlobalVars()
    

    variables.spec.ts

    import { Vars } from './variables.ts'
    
    describe('Test The Package', () => {
      it('Should accept new variables', () => {
        Vars.newVariable = 'new variable'
        expect(Vars.newVariable).toEqual('new variable')
      })
    })
    
    

    关于如何解决这个问题的任何想法?

    最佳答案

    尽管我已经单独尝试过它们,但我没有一起尝试过它们( transformtransformIgnorePatterns )。所以这个 Jest 配置解决了我的问题:

      "jest": {
        "preset": "ts-jest",
        "testEnvironment": "node",
        "transform": {
          "node_modules/variables/.+\\.(j|t)sx?$": "ts-jest"
        },
        "transformIgnorePatterns": [
          "node_modules/(?!variables/.*)"
        ]
      },
    
    我的错误是:
  • 不使用 transformtransformIgnorePatterns 一起 .
  • 并定义 babel-jest作为变压器而不是 ts-jest (我猜想,当 jest 的 预设 被定义为 ts-jest 时,这是一个问题。因为如果我将其更改为 babel-jest 它会再次引发相同的错误。):
  • --- "node_modules/variables/.+\\.(j|t)sx?$": "babel-jest"
    +++ "node_modules/variables/.+\\.(j|t)sx?$": "ts-jest"
    

    关于typescript - Jest 不会转换模块 - SyntaxError : Cannot use import statement outside a module,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61781271/

    相关文章:

    reactjs - React Jest - 意外的 token 导入

    javascript - 错误 TS2554 : Expected 2-3 arguments, 但得到 1

    javascript - systemjs 在 angular2-rc1 中不起作用

    javascript - typescript 文件语法错误的 Jest 测试 : "interface is a reserved word in strict mode"

    reactjs - react / enzyme : Invariant Violation error when running Jest/Enzyme test

    reactjs - 开 Jest 如何在package.json脚本中设置文件模式

    javascript - 可滚动的 highchart 在 JS 中工作,但在通过 Angular HighCharts 运行时出现问题?

    typescript - 自定义组件未在 Ionic v4 + Angular 6 中显示

    reactjs - 如何使用 babel-jest 转译测试

    typescript - 如何配置 Jest 以转换包含无效语法的模块?