Webpack处理es6
webpack能自动处理import和export,所以很多人认为webpack能自动处理es6,其实不然。只是因为模块打包需要,所以处理import和export,除此之外他并不能转换其他的es6特性。
为了能够解析es6,需要为我们的js文件配置一个额外的编译型loader,最常用的就是babel-loader
具体做法如下:
-
先安装一下相应的loader:
yarn add babel-loader @babel/core @babel/preset-env --dev
-
安装完成过后需要指定加载器
-
module:{ reles:[ { test:/.js$/, use:{ loader:'babel-loader', option:{ presets:['@babel/preset-env'] } } } ] }
-
-
最后进行打包
总结
- Webpack只是打包工具。
- 加载器用来编译转换代码。