首先初始化
npm init
安装webpack
npm install webpack --save
安装babel
npm install babel-core babel-preset-es2015 --save
npm install babel-loader --save
安装less
npm install css-loader style-loader less less-loader --save
创建一个webpack.config.js配置文件
var path = require('path')
var outPath = path.resolve(__dirname, './bundle')
module.exports = {
entry: './app.js',
output: {
path: outPath,
filename: 'app.bundle.js',
},
module: {
loaders: [{
test: /\.js$/,
exclude: /node_modules/,
loader: 'babel-loader'
},{
test: /\.css$/,
exclude: /node_modules/,
loader: 'style-loader!css-loader'
},{
test: /\.less$/,
exclude: /node_modules/,
loader: 'style-loader!css-loader!less-loader'
}]
}
}
在根目录下创建一个.babelrc文件
{ "presets": [ "es2015" ] }
在package.json中配置scriptsm,添加脚本
"start": "webpack --watch --progress --colors --display-chunks "
我的项目地址：github
