Babel 6轉換運行時：$ export不是函數

Question

我正在嘗試合並Babel的轉換運行時，以使我的代碼與IE9兼容。 但自從集成它以后，代碼甚至不能在Chrome上運行。 我得到錯誤Uncaught TypeError: $export is not a function es6.object.define-property.js:3上Uncaught TypeError: $export is not a function 。 沒有我的.babelrc中的“transform-runtime”行，一切運行正常。 有任何想法嗎？

這是我的.babelrc ：

{
  "plugins": [
    "transform-runtime"
  ],
  "presets": [
    "es2015",
    "react"
  ]
}

還有我的webpack.config.js ：

var webpack = require('webpack');

var commonsPlugin = new webpack.optimize.CommonsChunkPlugin('common.js');

module.exports = {
  entry: {
    EventAdmin: './src/event_admin',
    EventRender: './src/event_render'
  },
  output: {
    path: '../public/js2',
    filename: '[name].js' // Template based on keys in entry above
  },
  externals: {
    // require("jquery") is external and available
    //  on the global var jQuery
    'jquery': 'jQuery'
  },
  plugins: [commonsPlugin],
  devtool: 'source-map',
  module: {
    loaders: [
      { test: /\.css$/, loader: 'style-loader!css-loader' },
      {
        test: /\.js$/,
        loader: 'babel-loader'
      },
    ]
  }
};

Answer 1

嘗試在loader: 'babel-loader'之后添加exclude: /node_modules/ loader: 'babel-loader' 。 嘗試在不排除node_modules的情況下運行運行時轉換器時遇到了同樣的問題。 不過，我不知道潛在的問題。

Answer 2

您好我有同樣的問題，最后找到了適合我的解決方案。 看到：

loaders: [
  {
    test: /.js/,
    loader: 'babel',
    query: {
      presets: ['es2015', 'es2017'],
      plugins: [
        ['transform-runtime', {
          helpers: false,
          polyfill: false,
          regenerator: true, }],
        'transform-es2015-destructuring',
        'transform-object-rest-spread',
        'transform-async-to-generator',
        ],
     },
  },
]

請參閱'transform-runtime'部分。 我希望這有幫助。

Answer 3

您可以按照文檔中的建議，嘗試將“exclude”替換為“include”。

盡可能選擇“包括”......

這對我有用。

{
  "test": /\.js/,
  "loader": "babel",
  "include": [path.resolve(__dirname, './src')]
}

Answer 4

首先你必須安裝babel-plugin-transform-runtime然后像我一樣使用它：

{
  "presets": [
    "es2015",
    "react",
    "stage-0"
  ],
  "plugins": [
    "transform-runtime"
  ]
}

之后你必須在webpack配置文件中的babel-loader添加exclude鍵：

{
    test: /\.(js|jsx)$/,
    exclude: /node_modules/,
    use: [
        {
            loader: 'babel-loader',
        }
    ]
}

注意：請寫/node_modules/ not /(node_modules\\/)/或/node_modules\\// ，這很奇怪，但這種方式有效。

Answer 5

通過Babel 6運行core-js文件看起來有問題，因為Babel 6不再將require('something')轉換為require('something').default為Babel 5。 我甚至嘗試通過這個插件https://www.npmjs.com/package/babel-plugin-add-module-exports運行它，但不管我做了什么，它都不能正確地糾正require語句。 我最終只需要通過將exclude屬性設置為以下來排除core-js和各種Babel相關文件被babel-loader處理：

[ /node_modules\\/babel-/m, /node_modules\\/core-js\\//m, /node_modules\\/regenerator-runtime\\//m ]

作為旁注 ，我沒有重新安裝我的node_modules因為轉換為Babel 6，這導致了同樣的問題，但出於其他一些神秘的原因。

Answer 6

對於那些使用webpack的人，請確保在webpack配置文件中不包含node_modules文件夾以及以下內容：

module: {
  rules: [
    {
      test: /\.js$/,
      // With this line, make sure you only include your javascript
      // source files
      include: [ path.resolve(__dirname, './src') ],
      use: {
        loader: 'babel-loader',
        options: {
          presets: ['env'],
          plugins: ['transform-runtime']
        }
      }
    }
  ]
}

Answer 7

你也安裝了babel-runtime嗎？

我剛剛安裝了兩個並在.babelrc中添加了插件，結果很好。