Webpack CLI忽略.babelrc
我正在尝试使用wepback cli来构build一个非常简单的脚本…非常多:
import 'somelib'; import '../mylib';
我在跑
webpack --output-filename index.js foo.js
但是这给了我:
错误在./foo.js中
模块parsing失败:/dir/foo.js第1行:意外的令牌
你可能需要一个合适的加载器来处理这个文件types。
| 导入'somelib';
| 导入'../mylib';
|
这表明webpack没有正确地预处理这些文件,但是我在同一个目录下有一个.babelrc
文件:
{ "presets": ["es2015", "stage-0"], "plugins": ["transform-runtime", "transform-regenerator", "syntax-async-functions", "transform-async-to-generator"] }
我确实已经安装了相应的babel预设和插件,事实上babel
在foo.js
上可以正常工作。
我为Babel和Webpackfind的文档似乎都会说它会自动使用.babelrc
而且我没有看到任何webpack的cli标志 ,可以让你指定babelconfiguration,包括插件/预设。
有没有什么办法可以让webpack cli使用我在.babelrc
指定的插件和预设?
要使用webpack的babel,你应该安装并注册babel-loader 。
babel-loader
尊重.babelrc
文件,所以不需要任何额外的configuration。
所以,首先你必须安装它:
npm i babel-loader -D
那么您应该在CLI命令中使用适当的--module-bind
标志 :
webpack --module-bind 'js=babel' --output-filename index.js foo.js
或为您的应用程序( webpack.config.js
或webpack.config.babel.js
)创buildwebpackconfiguration文件:
module.exports = { entry: './foo.js', output: { filename: 'index.js' }, module: { loaders: [{ test: /\.jsx?$/, exclude: /(node_modules|bower_components)/, loader: 'babel' }] } }
所以不需要指定任何命令行参数来构build你的项目:
webpack