使用Webpack和Babel将ES6转换为AMD

Question

我在我的应用程序中使用webpack，并让babel将我的js / jsx文件从es6转换为es5。

我想让babel将这些文件中加载的模块转换为AMD。我看到如何用grunt-babel做到这一点： Using Babel to convert ES6 modules to ES5 AMD modules, not working as expected

如果我想让webpack处理babel转换，我该如何做？

例如，在webpack.config.js中我有：

module: {
  loaders: [{
    test: /\.jsx?$/,
    exclude: /node_modules/,
    loader: 'babel'
  }
}

我可以在那里为Babel设置一个使用AMD的选项吗？

Answer 1

您可以使用query键设置babel的选项：

module: {
  loaders: [{
    test: /\.jsx?$/,
    exclude: /node_modules/,
    loader: 'babel',
    query: {
        modules: 'amd'
    }
  }
}

对于所有可用选项，请查看此处：http://babeljs.io/docs/usage/options/

Answer 2

如果要将整个捆绑包生成为AMD模块，可以在＆＃34; output.libraryTarget＆＃34;中设置它。配置：

{
  output: {
    libraryTarget: "amd"
  }
} 

请参阅此处，＆＃34; output.libraryTarget＆＃34;： https://webpack.github.io/docs/configuration.html