Jest报错：Unexpected token，默认导出语法引发测试失败

兄弟，我之前也踩过一模一样的坑！你遇到的问题本质是Jest默认不支持export default from './Header';这种简写导出语法——它属于ES模块的提案级语法，并不是标准ES6/ES2015的官方语法，所以Jest依赖的Babel转译器如果没配置对应的插件，就会把它识别成非法代码，抛出那个"Unexpected token"的错误。

你后来改用的import Header from './Header'; export default Header;是标准的ES模块导出写法，所有支持ES模块的环境都能正常解析，所以自然不会报错。而那个简写语法其实就是这个标准写法的语法糖，但因为没被纳入正式标准，需要额外的Babel插件来转译。

给你两个可行的解决方案：

• 方案一：配置Babel支持该提案语法

  1. 先安装对应的Babel插件：

     npm install --save-dev @babel/plugin-proposal-export-default-from
     # 或者用yarn：
     yarn add -D @babel/plugin-proposal-export-default-from
     

  2. 在你的Babel配置文件（比如.babelrc、babel.config.json，或者package.json里的babel字段）中，把这个插件加入到plugins数组：

     {
       "presets": ["你的现有预设（比如@babel/preset-react、@babel/preset-env）"],
       "plugins": [
         "@babel/plugin-proposal-export-default-from",
         // 其他已配置的插件...
       ]
     }
     

  配置完成后，Jest就能正常解析export default from语法了。

• 方案二：继续使用标准导出写法
  就是你已经验证有效的import Header from './Header'; export default Header;写法，这种方式不需要额外配置，兼容性拉满，适合不想改动Babel配置的场景。

另外补充一句：你的Jest整体配置是没问题的（毕竟200+用例都能跑通），只是刚好这个Header组件用到了非标准的简写语法，才触发了这个报错~

内容的提问来源于stack exchange，提问作者Sahil Jain