You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Ejected Create-React-App中Atlaskit包引发Jest测试失败求助

Fix Jest SyntaxError with Atlaskit Packages in Ejected Create-React-App

I’ve run into this exact issue with Atlaskit and ejected CRA projects before—here’s how to get your tests working again:

The Core Problem

Jest skips transpiling files in node_modules by default, but most Atlaskit packages ship with untranspiled ES module syntax (like export statements) that Jest can’t parse out of the box. Your initial attempts to tweak transformIgnorePatterns were on the right track, but let’s adjust the config properly.

Step 1: Update Jest’s transformIgnorePatterns

You need to tell Jest to stop ignoring the files that are causing the error. Here are two approaches:

Option 1: Transpile All Node Modules (Quickest Fix for Your Request)

If you want every package in node_modules to be transpiled (as you mentioned in your goal), replace your current transformIgnorePatterns in package.json with this:

"transformIgnorePatterns": [
  "^.+\\.module\\.(css|sass|scss)$"
]

This removes the rule that ignores JS/TS files in node_modules, so Jest will use babel-jest to transpile all of them—including Atlaskit packages.

Option 2: Transpile Only Atlaskit Packages (Better Performance)

If you want to avoid the performance hit of transpiling every node module, target only @atlaskit packages by negating them in the ignore pattern:

"transformIgnorePatterns": [
  "[/\\\\]node_modules[/\\\\](?!@atlaskit).+\\.(js|jsx|ts|tsx)$",
  "^.+\\.module\\.(css|sass|scss)$"
]

The (?!@atlaskit) part means "don’t ignore any files under @atlaskit in node_modules".

Step 2: Confirm Your Babel Test Config

Your existing .babelrc.js setup for the test environment looks good—making sure modules: 'commonjs' is set ensures Babel converts ES modules to the format Jest understands. Just double-check that this section is intact:

// .babelrc.js
test: {
  presets: [
    ["react-app", { 'preset-env': { 'modules': 'commonjs' }} ]
  ],
  plugins,
}

Step 3: Clear Jest’s Cache

Jest caches transpiled files aggressively, so old cached code might be holding onto the error. Clear it with:

npx jest --clearCache

Step 4: Run Your Tests Again

Now fire up your tests:

npm run test

Extra Troubleshooting

  • If you still see errors, make sure babel-jest is installed (it should be included in ejected CRA, but you can verify with npm list babel-jest).
  • If you’re using TypeScript, ensure @babel/preset-typescript is part of your test presets (the react-app preset usually includes this, but it’s worth checking).
  • Double-check for any conflicting Babel plugins that might be overriding your module settings.

内容的提问来源于stack exchange,提问作者SavSamoylov

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.13 06:36:34