在进行普通转换后如何转换模块

时间:2018-09-12 17:51:46

标签: reactjs babeljs openlayers jestjs babel-jest

用笑话测试React组件。其中一些组件使用OpenLayers(ol软件包v5.2.0)。在ol软件包v4中,我应用了transformIgnorePatterns来转换ol软件包:

"jest": {
    "transformIgnorePatterns": [
         "node_modules/(?!(ol)/)"
    ],
    (...)
}

现在,在运行NODE_ENV=test jest时出现以下错误:

(...)
(...)/node_modules/ol/index.js:5
export {default as AssertionError} from './AssertionError.js';
^^^^^^

SyntaxError: Unexpected token export

  14 |     let map = new Map({
  15 |       layers: options.layers,
> 16 |       target: 'map',
     |           ^
  17 |       view: options.view,
  18 |       controls: options.controls
  19 |     });

我在.babelrc中应用了以下预设和插件:

"presets": [
   ["@babel/preset-env", {
     "modules": false
    }
   ],
   "@babel/preset-react"
],
"plugins": [
    "lodash",
    ["@babel/plugin-transform-runtime", {
      "corejs": 2,
      "helpers": true,
      "regenerator": true,
      "useESModules": false
    }
  ],
  "@babel/plugin-transform-modules-commonjs",
  "@babel/transform-arrow-functions",
  "@babel/plugin-syntax-dynamic-import",
  "@babel/plugin-syntax-import-meta",
  ["@babel/plugin-proposal-class-properties", {"loose": false}],
  "@babel/plugin-proposal-json-strings"],
"env": {
    "production": {},
    "development": {},
    "test": {
      "presets": [
        ["@babel/preset-env"],
        "@babel/preset-react"
      ]
    }
  }

在构建应用程序时,通过应用global-transform选项(https://github.com/browserify/browserify#usage)可以解决类似的问题。此问题线程:https://github.com/openlayers/openlayers/issues/8497

$ browserify -g [ babelify --presets [ \"@babel/preset-env\" ] --ignore [ \"//node_modules/(?!ol/)/\" ] ] ./src/index.js -o ./public/js/bundle.js

我想对ol模块应用类似的转换,但是不确定如何实现。 cf.transformIgnorePatterns用于解决此问题。 https://github.com/facebook/jest/issues/2550

1 个答案:

答案 0 :(得分:1)

如果将 .babelrc 的内容放入项目根目录中的 babel.config.js 中,该错误将不再发生。

module.exports = {
    (...)
};

cf。

副作用-TypeError: $export is not a function在加载通过browserify / babelify构建的包时,但我认为这是一个配置问题。

编辑:通过将插件“ @ babel / plugin-transform-runtime”的选项更改为:

,为我解决了副作用
{
  "corejs": false,
  "helpers": false,
  "regenerator": true,
  "useESModules": false
}

cf。 https://stackoverflow.com/a/39502362/3798151并安装@ babel / runtimecf。 https://babeljs.io/docs/en/babel-plugin-transform-runtime