webpack 配置es6语法转义es5语法方法
前端自动化生产工具:webpack
webpakc安装
npm add --dev babel-loader babel-core babel-preset-env webpack
npm install webpack --save
依赖包
babel-loader
babel-core
babel-preset-env
安装方法 npm install 包名
如果安装不成功可能是本地访问国外网络较慢 建议使用淘宝镜像资源来安装
淘宝镜像资源使用方法:
npm install -g cnpm --registry=https://registry.npm.taobao.org
cnpm install [name]
安装好以上依赖后然后配置 webpack.config.js:
var path = require('path');
module.exports = {
entry: './src/index.js',
output: {
filename: 'bundle.js',
path: path.resolve(__dirname, 'dist')
},
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader',
options: {
presets: ['env']
}
}
}
]
}
};
以上配置好后可以使用以下命令来执行es6转es5语法
webpack //对项目进行打包
webpack --watch // 自动监控文件的改变