webpack 常用配置 自用

var htmlWebpackPlugin = require('html-webpack-plugin');
var CleanWebpackPlugin = require('clean-webpack-plugin');
var path = require("path");
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
module.exports = {
    entry:'./lib/main2.js',
    output:{
        path: path.resolve(__dirname, '../lib'),
        filename:'[name].[hash].js'
    },
    module:{
        loaders:[
            {
                test:/\.js$/,
                loader:'babel-loader',
                // exclude:'./node_modules/',//排除的范围

                include:path.resolve(__dirname, '../lib/'),//包含的范围
                // query:{
                //     presets:['lastest']
                // }
                // 可以在package.json中加入
                // "babel":{
                //     "presets":["lastest"]
                 // },
            },
            {
                test:/\.css$/,
                loader:'style-loader!css-loader?importLoaders=1!postcss-loader'
            },
            {
                test:/\.less$/,
                loader:'style-loader!css-loader?importLoaders=1!postcss-loader!less-loader'
            },
            {
                test:/\.html$/,
                loader:'html-loader'
            },
            {
                test:/\.tpl$/,
                loader:'ejs-loader'
            },
            // {
            //     test:/\.(png|jpg|gif|svg)$/i,
            //     loader:'file-loader',
                // query:{
            //         name:'assets/[name].[ext]'
                // }
            // },
            {
                test:/\.(png|jpg|gif|svg|woff|eot|ttf)$/i,
                loaders:[
                    'url-loader?limite=20000&name=assets/[name].[ext]',
                    'image-webpack-loader'//压缩图片
                ],
                // loader:'url-loader',
                // query:{
                //     limit:20000,
                //     name:'assets/[name].[ext]'
                // }
            }
        ]
    },
    
    plugins:[
        new htmlWebpackPlugin({
            filename:'../index.html',
            template:'index2.html',
            inject:'body'
        }),
         new UglifyJsPlugin(),
        new CleanWebpackPlugin(
            [
                path.resolve('lib/main.*.js'),
            ],
            {
                root: path.resolve(__dirname, '../lib/'),
                verbose: true,
                dry: false,
                watch: true,
            }
        ),
    ]
}

相关推荐