1、檢視webpack打包檔案以及對應資訊
webpack --display-modules --display-reasons

2、webpack -p ：會對檔案進行優化，壓縮等

3、webpack -d :對應配置檔案的devtool

4、webpack -w :就不需要每次一修改程式碼就去編譯，修改了程式碼直接
重新整理瀏覽器就行了

5、配置熱載入：
    5.1 下載webpack-dev-server依賴
    npm install -g webpack-dev-server --save-dev
    5.2命令列執行命令,啟動伺服器8080埠
    webpack-dev
 
-server --inline --hot

6、dev、test、prod環境區分：
    debug = process.env.NODE_ENV == 'production'
    //然後webpack中對應debug，就可以針對不同環境配置

    配置檔案：
    var debug =  process.env.NODE_ENV == 'production' ? false : true

module.exports = {
    devtool:debug ? "sourcemap" : null,
    entry:"./js/entry.js",
    output:{
        filename:"bundle.js"
 

    },
    module:{
        loaders:[
            {
                test: /\.css$/,
                loader: "style-loader!css-loader"  //如果字尾是css,就是用style,css的loader來處理
            },
            {   //配置使用es6語法寫js
                test:/\.js$/,
                loader:"babel-loader",
                exclude:/node_modules/
 
,   //忽略掉這個資料夾下的
                 options: {
                    presets: ['es2015','stage-0'],
                    plugins: ['transform-runtime']
                }
            },{
                //配置vue
                test:/\.vue$/,
                loader:'vue-loader'
            }
        ]
    },
    plugins:debug ? [] :[
        //外掛
        new webpack.optimize.OccurrenceOrderPlugin(),
    ],
    resolve:{
        alias:{
            'vue$':'vue/dist/vue.js'
        }
    }
}


7、兩個分析使用工具
    7.1生成專案所有配置分析檔案並分析
    webpack --profile --json > stats.json
    開啟webpack提供的分析網站，然後選中stats.json
    網址：http://webpack.github.io/analyse/

    7.2選擇stats.json
    網站：http://chrisbateman.github.io/webpack-visualizer/