webpack-Tree Shaking

tree sharkingは、JavaScriptコンテキストの未参照コード(dead-code)の除去を記述する用語である.ES 2015モジュールシステムにおける静的構造特性、例えばimportおよびexportに依存する.この用語と概念は実際にES2015モジュールのパッケージ化ツールのrollupに興っている.日常的な開発には常に各種のライブラリを引用する必要がありますが、これらのライブラリの一部だけを使用している場合が多く、すべてが必要ではありません.この時、Tree-Shakingは使用していないコードを削除してくれると、パッケージ化されたコードの量が大幅に削減されます.
tree sharkingの限界:(1)静的な声明と引用するES 6モジュールだけであって、動的な導入と声明ができない.CommunJSモジュールはダイナミック構造をサポートしていますので、CommunJSモジュールに対してtree-sharking処理はできません.
JS Tree Shaking Webpack.optimize.UglifyJsPlugin()//廃棄コードを削除するシーンの通常最適化を使用して、第三者ライブラリのある機能を導入する.

//    
npm install uglifyjs-webpack-plugin --save-dev

//webpcak.config.js
var UglifyJsPlugin = require('uglifyjs-webpack-plugin');

module.exports = {
...
//  js
     optimization: {
        minimizer: [
            new UglifyJsPlugin({
                uglifyOptions: {
                    compress: false
                }
            })
        ]
    },
};

//app.js
import { a,b } from './common/util'
console.log(a());
console.log(b());

import { chunk } from 'lodash-es'
console.log(chunk([1,2,3,4,5,6,],2))

Lodash Tree sharkingソリューションlodash//Not working lodash-s//どうしてもだめなら、下のこのBabel-pluglin-lodashをインストールします.
生産環境では、tree-sharkingはできません.これもwebpackが生産環境を向上させて、速度を構築する手段の一つかもしれません.webpackコマンドは、tree-sharking、npm run dev命令ではtree-sharkingできません.自らテストしました.
CSS Tree Shaking Purify CSShttps://github.com/purifycss/purifycss purrifycss-webpack//webpackに対するプラグインoptions paths:glob.sync([])//マルチパスファイルを処理するために、purfycssを使用する場合はglob.sync方法を使用します.

//    
npm install purifycss-webpack glob-all purify-css --save-dev

//webpack.config.js
var PurifyCss = require('purifycss-webpack');
var glob = require('glob-all');  

plugins:[
        new ExtractTextWebpackPlugin({
            filename:'[name].min.css',   //   css   
            allChunks:false
        }),
        new PurifyCss({
            paths:glob.sync([
                path.join(__dirname,'./*.html'),
                path.join(__dirname,'./src/*.js')
            ])
        })
    ]