Angular运行测试引入d3-zoom出现Unexpected token 'export'错误如何解决

这个错误本质是Jest默认不会转译node_modules目录下的第三方包，而你引入的d3-zoom等高版本d3生态包采用了ES Module语法输出，Jest运行时默认只识别CommonJS语法，因此无法解析export关键字，该问题和Node版本无关，降级Node自然无法解决问题。

以下方案按优先级从高到低尝试即可：

• 方案1：修改Jest配置，将d3相关包加入转译白名单
  找到你项目根目录下的jest.config.js配置文件，修改transformIgnorePatterns配置项：

  module.exports = {
    // 其他原有配置保留
    transformIgnorePatterns: [
      'node_modules/(?!.*\\.mjs$|d3-.+)'
    ]
  }
  

  如果你是在angular.json中配置测试参数，找到projects.[你的项目名].architect.test.options下的jestConfig对应的配置文件做上述修改即可。
  修改完成后重新运行测试，绝大多数情况下该问题可以直接解决。

• 方案2：修正测试环境的TS编译配置
  打开项目下的tsconfig.spec.json，检查compilerOptions下的module配置，确保设置为CommonJS：

  {
    "compilerOptions": {
      // 其他原有配置保留
      "module": "CommonJS"
    }
  }
  

  该配置会强制测试环境下的TS代码编译为Jest可识别的CommonJS格式，避免模块语法冲突。

• 方案3：降级d3版本适配旧构建环境
  如果你使用的Angular版本低于13，无法兼容纯ES Module的第三方包，可以将d3生态包降级到支持CommonJS输出的版本：

  # 全量安装d3 v6版本
  npm install d3@6
  # 如果你是单独安装d3-zoom等子包，单独降级即可
  npm install d3-zoom@2 d3-scale@3 d3-selection@2
  

  降级完成后重新运行测试即可。

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