reactjs - 尝试集成 jest 并与 amchart 使用react，但出现错误。可能是什么问题？

Question

以下是我在运行 npm test 时遇到的错误:

      export { System, system } from "./.internal/core/System";
        ^^^^^^

    SyntaxError: Unexpected token export

      1 | import React from 'react';
    > 2 | import * as am4core from "@amcharts/amcharts4/core";
      3 | import * as am4charts from "@amcharts/amcharts4/charts";


      at ScriptTransformer._transformAndBuildScript (node_modules/jest-runtime/node_modules/@jest/transform/build/ScriptTransformer.js:537:17)

Answer 1

AmCharts 以 ES2015 标准提供他们的包，所以它不支持 IE9 或任何旧浏览器。

React 默认脚本强制所有使用的库都编译为与 CommonJS 兼容。

默认情况下，Jest 不编译任何 node_modules 并尝试按原样运行 amCharts 代码并失败。

如果您从 react-scripts 中弹出，那么您可以更新 jest 配置:

"jest": {
    "transformIgnorePatterns": [
      "[/\\\\]node_modules[/\\\\](?!(@amcharts)\\/).+\\.(js|jsx|ts|tsx)$"
    ],
...
}

如果您不想弹出，则需要使用 transformIgnorePatterns 作为 cli 选项:

react-scripts test --transformIgnorePatterns '[/\\\\]node_modules[/\\\\](?!(@amcharts)\\/).+\\.(js|jsx|ts|tsx)$'"

注意:React 团队反对使用此选项的原因之一是，您在测试中的代码将与生产中的代码不同(编译与未编译)，但只要您不测试图表，而只是将它们模拟为依赖项即可应该没事。