Babel + Webpack 破坏 es6 导入

如何解决Babel + Webpack 破坏 es6 导入

我开发了一个小型的 Typescript+React 单页 Web 应用程序。我将它与 webpack 捆绑在一起，可以很好地与 ts-loader 或 babel 配合使用。但是，如果我将 "useBuiltIns": "usage" 添加到我的 @babel/preset-env 配置中，webpack 会开始抛出一堆与此相同或类似的警告（均与 ES 导入相关）：

WARNING in ./app.tsx 408:134-153
export 'createElement' (imported as 'React') was not found in 'react' (possible exports: __esModule)
WARNING in ./calendar.tsx 909:60-79
export 'DateTime' (imported as 'DateTime') was not found in 'luxon' (possible exports: __esModule)

我的 webpack 配置：

const path = require('path');

module.exports = (env,argv)=>{
  return {
    entry: path.join(__dirname,'./entry-firebase.tsx'),devtool: 'source-map',module: {
      rules: [
      {
        test: /\.css$/i,use: ["style-loader","css-loader"],},{
          test: [/\.tsx?$/,/\.jsx?$/],//exclude: ()=>false,use: {
            loader: 'babel-loader',options: { 
              presets: [ 
                [require("@babel/preset-env"),{
                  "corejs": { "version":3 },"useBuiltIns": "usage","targets": {
                    "edge": "17","firefox": "60","chrome": "67","safari": "11.1","ie": "11"
                  },//modules: false
                }],require("@babel/preset-react"),require("@babel/preset-typescript"),],"plugins": [
                [require("@babel/plugin-proposal-decorators"),{
                    "legacy": true
                }]
              ]
            }
          }
        },resolve: {
      extensions: ['.tsx','.ts','.js','.jsx'],output: {
      filename: 'bundle-compat.js',path: path.resolve(__dirname,'../public')
  }
};

捆绑包也不起作用，Firefox 显示以下错误：

Uncaught TypeError: wrappedWellKNownSymbolModule.f is not a function
    exports define-well-kNown-symbol.js:9
    js es.symbol.iterator.js:5