在webpack配置文件中使用babel插件

时间:2018-03-28 10:33:31

标签: javascript webpack babel

在他们的网站上,webpack显示了这样的插件用法

  plugins: [
    new webpack.optimize.UglifyJsPlugin(),
    new HtmlWebpackPlugin({template: './src/index.html'})
  ]

我想使用babel插件transform-async-to-generator,所以我在babelrc文件中添加它但我不知道这已经足够了,我应该添加它还是webpack文件吗?如果是这样的话

我无法确定是否需要在webpack配置文件中编写插件,因为我现在收到运行时错误,并且不确定它是否只能在babelrc文件中编写。

我当前的webpack配置文件

var path = require('path')

module.exports = {
  entry: path.resolve(__dirname, 'partner/index.js'),
  output: {
    path: path.resolve(__dirname, './dist'),
    filename: 'partner_bundle.js'
  },
  target: 'web',
  module: {
    rules: [
      {
        test: /\.js$/, // Check for all js files
        loader: 'babel-loader',
        query: {
          presets: [
            'babel-preset-env',
            'babel-preset-stage-0'
          ].map(require.resolve)
        },
        exclude: /node_modules\/(?!other-module)/
      }
    ]
  },
  stats: {
    colors: true
  },
  devtool: 'source-map',
  resolve: { symlinks: false }
}

babelrc文件

{
  "presets": [
    "env",
    "stage-2"
  ],
  "plugins": [
    "transform-async-to-generator",
    "transform-async-generator-functions",
    [
      "transform-runtime",
      {
        "helpers": false,
        "polyfill": false,
        "regenerator": true
      }
    ]
  ]
}

1 个答案:

答案 0 :(得分:0)

在这里您可以在我的webpack配置中看到我如何包含babel插件:

now.add(Calendar.MILLISECOND, diffInMillies.toInt())