webpack 配置

var path = require('path');
var webpack = require('webpack');
var ExtractTextPlugin = require("extract-text-webpack-plugin");
var HtmlWebpackPlugin = require("html-webpack-plugin");

module.exports = {
    entry: {
        main: './app/index.js',
        vendor: 'moment'
    },
    output: {
        path: path.resolve(__dirname, 'dist'),
        filename: '[chunkhash].[name].js'
    },
    module: {
        rules: [{
            test: /\.js$/,
            loader: 'babel-loader',
            exclude: /node_modules/
        }, {
            test: /\.css$/,
            use: ExtractTextPlugin.extract({
                use: 'css-loader'
                    /*minChunks: function(module) {
                        // 该配置假定你引入的 vendor 存在于 node_modules 目录中
                        return module.context && module.context.indexOf('node_modules') !== -1;
                    }*/
            })
        }, {
            test: /\.(jpg|png|gif)$/,
            loader: 'file-loader'
        }, {
            test: /\.(woff|woff2|eot|ttf|svg)$/,
            loader: 'url-loader?limit=100000'
        }]
    },
    plugins: [
            new ExtractTextPlugin('style/common.css'),
            new webpack.optimize.CommonsChunkPlugin({
                name: 'vendor' // 指定公共 bundle 的名字。
            }),
            new HtmlWebpackPlugin({
                template: './index.html'
                    // chunksSortMode: 'dependency'
            })
        ]
        /*module: {
            rules: [{
                test: /\.css$/,
                loaders: [
                    use: [{
                        loader: "style-loader"
                    }, {
                        loader: "css-loader",
                        query: {
                            options: {
                                modules: true
                            }
                        }
                    }]
                ]
            }, {
                test: /\.jsx$/,
                loader: "babel-loader",
                options: {
                    //......
                }
            }]
        }*/
};


if (process.env.NODE_ENV === 'production') {
    module.exports.devtool = '#source-map'
        // http://vue-loader.vuejs.org/en/workflow/production.html
    module.exports.plugins = (module.exports.plugins || []).concat([
        new webpack.DefinePlugin({
            'process.env': {
                NODE_ENV: '"production"'
            }
        }),
        new webpack.optimize.UglifyJsPlugin({
            sourceMap: true,
            compress: {
                warnings: false
            }
        }),
        new webpack.LoaderOptionsPlugin({
            minimize: true
        })
    ])
}

posted @ 2017-05-05 17:20  佛陀  阅读(207)  评论(0编辑  收藏  举报