配置含Mocha、Chai、Sinon的ES6项目时遇Unexpected token import错误

这个问题我之前也踩过坑，核心原因就是Mocha默认不会自动转译ES6的import语法，得让它和Babel配合起来工作才能正确解析代码。下面是一步步的排查和解决步骤：

1. 先确认必备依赖是否安装完全 #

首先你得确保把Babel核心依赖和Mocha适配的插件都装齐了，打开终端执行：

npm install --save-dev @babel/core @babel/preset-env @babel/register mocha chai sinon

这里@babel/register是关键，它能让Node在运行时通过Babel实时转译代码，解决ES6语法不兼容的问题。

2. 检查你的.babelrc配置是否正确 #

你的.babelrc需要配置成适配当前Node版本的预设，示例配置如下：

{
  "presets": [
    [
      "@babel/preset-env",
      {
        "targets": {
          "node": "current"
        }
      }
    ]
  ]
}

这个配置会告诉Babel根据你当前使用的Node版本来针对性转译ES6语法，确保兼容性拉满。

3. 修改package.json中的test脚本 #

原来的test脚本可能只是简单的mocha，得改成让Mocha先加载Babel转译器，比如：

{
  "scripts": {
    "test": "mocha --require @babel/register src/**/*.spec.js"
  }
}

这里的--require @babel/register是核心，它会让Mocha在运行测试文件前，先启动Babel转译流程，这样测试文件里的import就能被正确识别了。如果你的测试文件不在src目录，记得把路径改成你实际的位置，比如test/**/*.spec.js。

4. 验证测试文件的导入路径 #

确保你的App.spec.js里的import路径是正确的，比如如果App.js在src目录下，导入语句应该是：

import { yourFunction } from './App.js';

路径错误有时候也会伪装成语法错误，这点别忽略。

5. 额外排查（如果上面步骤都没用的话） #

• 检查Node.js版本是否过低，建议升级到LTS版本（比如16.x及以上），旧版本对ES6语法的原生支持有限；
• 确认测试文件后缀是.js，如果用.mjs的话配置逻辑会不一样，常规项目用.js就足够；
• 看看项目根目录下有没有其他Babel配置文件（比如babel.config.json）和.babelrc冲突，建议统一成一种配置格式。

按照上面的步骤走，应该就能解决这个Unexpected token import的问题了。

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