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/

    相关文章:

    angular - 在我的应用程序上看不到自定义 Google map 样式

    ecmascript-6 - 在 Jest 中运行循环 ES6 导入时为 "Maximum call stack size exceeded"

    javascript - 如何将月份值从一个 Date 对象复制到另一个?

    typescript - 如何从名称或 cidr 获取子网 ID

    javascript - 您如何在每次测试中用 Jest 模拟默认导出对象?

    vue.js - VueJS - 使用 vue-test-utils 进行单元测试会出错 - TypeError : _vm. $t 不是函数

    javascript - 如何在 Jest 的 xyz.test.js 中导入 ".mjs"模块?

    javascript - 为什么我的 Jest 测试的堆栈跟踪指向错误的行号?

    Typescript 泛型扩展类和接口(interface)

    javascript - Jest : Testing window. location.reload