const path = require('path')
const webpack = require('webpack')
const ExtractTextPlugin = require('extract-text-webpack-plugin')
var htmlWebpackPlugin = require("html-webpack-plugin");
module.exports = {
    entry: {
        'index': './assets/js/index.es6'
    },
    output: {
        // path:指定编译的路径
        path: path.join(__dirname, './assets/'),
        // publicPath:给每个编译好的文件，在html中前面加上同样的路径
        publicPath: './',
        filename: 'js/[name].bundle.js'
    },
    module: {
        rules: [{
            test: /\.es6$/,
            use: [{
                loader: 'babel-loader',
                options: {
                    presets: [
                        ['env', {
                            //关闭babel编译es6,打开treeShaking
                            modules: false
                        }],
                    ]
                }
            }]
        }, {
            test: /\.less$/i,
            use: ExtractTextPlugin.extract({
                // fallback 所有的loader都失败了，才调用这个
                fallback: 'style-loader',
                use: [{
                    loader: 'css-loader'
                }, {
                    loader: 'less-loader'
                }]
            })
        }]
    },
    // 放到cdn，就不需要打包进项目了
    external:{
        jquery:'window.$'
    },
    plugins: [
        new ExtractTextPlugin("css/[name].css"),
        //提取出公用代码
        new webpack.optimize.CommonsChunkPlugin({
            name: 'common',
            minChunks: 2,
            filename: 'js/[name].js'
        }),
        // 自动把静态文件插入html
        new htmlWebpackPlugin({
            filename: 'index.html',
            template: './index.html',
            inject: true
        }),
        // treeShaking 开启压缩，自动去除没用到不需要的代码
        new webpack.optimize.UglifyJsPlugin({
            compress: {
                warnings: true
            },
            output: {
                comments: false
            },
            sourceMap: false
        }),
        // 把没用的function干掉了，代码看起来更好看
        new webpack.optimize.ModuleConcatenationPlugin()
    ]
}