{"id":653,"hash":"bc38f135a7a1258374497f36867fe3f188a1af7ce04e4c681fa2ae14ed0073b9","pattern":"Jest won't transform the module - SyntaxError: Cannot use import statement outside a module","full_message":"I couldn't get rid of this SyntaxError: Cannot use import statement outside a module error no matter what I have tried and it got so frustrating. Is there anybody out here solved this issue? I have read a million stackoverflow and github issue threads. No clear solutions.\n\nThis is a React, Typescript, Webpack project. I am trying to test a module. But Jest won't transform the module to plain javascript somehow.\n\nThe error I get is\n\n/Users/me/dev/Project/project/node_modules/variables/src/variables.js:12\n    import './main.js';\n    ^^^^^^\n\n    SyntaxError: Cannot use import statement outside a module\n\n      17 | \n      18 | */\n    > 19 | import { GlobalVars } from 'variables'\n         | ^\n      20 | \n      21 | export const Vars = new GlobalVars()\n      22 | \n\nWhat I have tried to solve this (and didn't work):\n\nUsing env setup in babel.config: env.test.preset: ['@babel/plugin-transform-modules-commonjs']\n\nmodifying transform setup in Jest configuration as '^.+\\\\.jsx?$': 'babel-jest', '^.+\\\\.tsx?$': 'ts-jest' and all other possibilities around this.\n\nIn Jest configuration, testPathIgnorePatterns, transformIgnorePatterns\n\nUsing  .babel.config.js instead of .babelrc.js\n\n...and more.\n\nI have this setup:\n\npackage.json\n\n  \"jest\": {\n    \"preset\": \"ts-jest\",\n    \"testEnvironment\": \"node\"\n  }\n\n.babelrc.js\n\nmodule.exports = {\n  presets: [\n    ['@babel/preset-env', { targets: { node: 'current' } }],\n    '@babel/preset-react',\n    '@babel/preset-typescript',\n  ],\n  plugins: [\n    '@babel/plugin-transform-runtime',\n    '@babel/proposal-class-properties',\n    '@babel/transform-regenerator',\n    '@babel/plugin-transform-template-literals',\n    'react-hot-loader/babel',\n  ],\n}\n\nvariables.ts\n\nimport { GlobalVars } from 'variables'\n\nexport const Vars = new GlobalVars()\n\nvariables.spec.ts\n\nimport { Vars } from './variables.ts'\n\ndescribe('Test The Package', () => {\n  it('Should accept new variables', () => {\n    Vars.newVariable = 'new variable'\n    expect(Vars.newVariable).toEqual('new variable')\n  })\n})\n\nAny idea on how to resolve this problem?","ecosystem":"npm","package_name":"typescript","package_version":null,"solution":"Even though I have tried them separately, I haven't tried them together (transform and transformIgnorePatterns). So this jest configuration solved my issue:\n\n  \"jest\": {\n    \"preset\": \"ts-jest\",\n    \"testEnvironment\": \"node\",\n    \"transform\": {\n      \"node_modules/variables/.+\\\\.(j|t)sx?$\": \"ts-jest\"\n    },\n    \"transformIgnorePatterns\": [\n      \"node_modules/(?!variables/.*)\"\n    ]\n  },\n\nMy mistakes were:\n\nNot using transform and transformIgnorePatterns together.\nAnd defining babel-jest as the transformer instead of ts-jest (I guess that is a problem when the preset of jest is defined as ts-jest. Because if I change it to be babel-jest it throws the same error again.):\n\n--- \"node_modules/variables/.+\\\\.(j|t)sx?$\": \"babel-jest\"\n+++ \"node_modules/variables/.+\\\\.(j|t)sx?$\": \"ts-jest\"","confidence":0.95,"source":"stackoverflow","source_url":"https://stackoverflow.com/questions/61781271/jest-wont-transform-the-module-syntaxerror-cannot-use-import-statement-outsi","votes":205,"created_at":"2026-04-19T04:51:27.260482+00:00","updated_at":"2026-04-19T04:51:27.260482+00:00"}