在webpack项目中引入less支持并支持热重载
配置:
var webpack = require('webpack')
var path = require('path')
var ExtractTextPlugin = require('extract-text-webpack-plugin')
module.exports = {
entry: './index.js',
// jquery.js: 'jquery',
// velocity: 'velocity-animate'
output: {
filename: 'bundle.js',
publicPath: "/js/",
path: path.resolve(__dirname, 'js')
},
module: {
rules: [
{test: /\.less$/, use: ["style-loader", "css-loader", "less-loader"], include: path.resolve(__dirname, './css')},
{test: /\.(png|gif|jpg|svg)/, use: ['file-loader']}
]
},
plugins: [
// new ExtractTextPlugin('../css/style.css'),
// new webpack.optimize.CommonsChunkPlugin({
// names: ['jquery', 'velocity','manifest']
// })
]
}
package.json
"name": "uber",
"version": "1.0.0",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"dev": "webpack-dev-server",
"build": "webpack -p"
},
"keywords": [],
"author": "",
"license": "ISC",
"description": "",
"devDependencies": {
"extract-text-webpack-plugin": "^2.1.2",
"file-loader": "^0.11.2",
"webpack": "^3.0.0",
"webpack-dev-server": "^2.5.0"
},
"dependencies": {
"babel-loader": "^7.1.0",
"css-loader": "^0.28.4",
"eslint-loader": "^1.8.0",
"jquery": "^3.2.1",
"less": "^2.7.2",
"less-loader": "^4.0.4",
"style-loader": "^0.18.2",
"url-loader": "^0.5.9",
"velocity-animate": "^1.5.0"
}
}