使用babel-istanbul-plugin为ReactJS项目生成覆盖率时构建报错

你的报错核心原因是当前安装的babel-plugin-istanbul版本不再支持Babel 6。你的项目使用的是babel-core@6.26.0（Babel 6生态），而新版babel-plugin-istanbul是为Babel 7+设计的，它依赖的AST节点类型（比如ClassPrivateProperty）在Babel 6的babel-traverse模块中无法识别，因此抛出了这个错误。

下面是两种可行的解决方案：

方案一：降级istanbul插件到兼容Babel 6的版本 #

这是最快的修复方式，不需要改动大量依赖：

1. 先卸载当前的babel-plugin-istanbul：

npm uninstall babel-plugin-istanbul

2. 安装最后支持Babel 6的稳定版本：

npm install babel-plugin-istanbul@4.1.6 --save-dev

3. 优化.babelrc配置（可选但推荐）：
   把istanbul插件限定在测试环境启用，避免影响开发/生产构建：

{
  "presets": ["env", "stage-0", "react"],
  "plugins": [
    "react-hot-loader/babel",
    "transform-decorators-legacy"
  ],
  "env": {
    "test": {
      "plugins": ["istanbul"]
    }
  }
}

之后运行测试时，记得设置NODE_ENV=test，比如：

NODE_ENV=test npm run test

方案二：升级到Babel 7（长期推荐） #

如果你的项目有条件升级，建议直接切换到Babel 7生态，这样可以使用最新的工具特性：

1. 卸载所有Babel 6相关依赖：

npm uninstall babel-core babel-preset-env babel-preset-react babel-preset-stage-0 babel-loader

2. 安装Babel 7的核心依赖和预设：

npm install @babel/core @babel/preset-env @babel/preset-react babel-loader@8 --save-dev

3. 安装替代的插件：

• 用@babel/plugin-proposal-decorators替代transform-decorators-legacy
• 安装新版babel-plugin-istanbul：

npm install babel-plugin-istanbul @babel/plugin-proposal-decorators --save-dev

4. 更新.babelrc配置：

{
  "presets": ["@babel/preset-env", "@babel/preset-react"],
  "plugins": [
    "react-hot-loader/babel",
    ["@babel/plugin-proposal-decorators", { "legacy": true }],
    "istanbul"
  ]
}

注意：Babel 7已经移除了stage-x预设，需要单独引入需要的提案插件。

完成上述任一方案后，重新运行构建或测试命令，应该就能正常生成代码覆盖率报告了。

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