var path = require('path');
var ExtractTextPlugin = require("extract-text-webpack-plugin");
var HtmlWebpackPlugin = require('html-webpack-plugin');
var webpack = require('webpack');
var UglifyJSPlugin = require('uglifyjs-webpack-plugin');
var OptimizeCssAssetsPlugin = require('optimize-css-assets-webpack-plugin');
module.exports = {
entry: {
'index':'./app/index.js',
'css':'./app/index.less'
},
resolve:{
extensions:['.js'],
alias: {
//设置全局jquery插件;
jquery: path.resolve(__dirname,'./bower_components/jquery/dist/jquery.js') //绝对路径;
},
module: {
rules: [
{
test: /\.html$/,
use: ['html-loader']
},
{
test: /\.(png|jpg|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)(\?[\s\S]+)?$/,
use: "file-loader?name=[name][hash].[ext]&outputPath=images/"
},
{
test: /\.less$/,
use: ExtractTextPlugin.extract({
fallback: 'style-loader',
//resolve-url-loader may be chained before sass-loader if necessary
use: ['css-loader', 'less-loader']
})
}
]} ,
plugins: [
new ExtractTextPlugin({
filename:"styles.css",
allChunks:true }),
new HtmlWebpackPlugin({
title:'hello',
filename: 'test.html',
template: 'app/index.html' }),
new webpack.optimize.CommonsChunkPlugin({
name: ['index'] }),
new UglifyJSPlugin(),
new webpack.ProvidePlugin({
$: 'jquery' }), //文件里遇见‘$’加载jquery
new OptimizeCssAssetsPlugin({
assetNameRegExp: /\.css$/g, //正则匹配后缀.css文件;
cssProcessor: require('cssnano'), //加载‘cssnano’css优化插件;
cssProcessorOptions: { discardComments: {removeAll: true } }, //插件设置,删除所有注释;
canPrint: true //设置是否可以向控制台打日志,默认为true;
} ) ],
devServer: {
stats: 'errors-only',
contentBase:'./',
disableDotRule:true
},
output: {
filename: '[name].js',
path: path.resolve(__dirname, 'dist'),
chunkFilename:'js/[name].js'
}
};