使用webpack2最小化捆綁包

Question

是否可以最小化我的捆綁文件和所有使用的模塊。 我在javascript中使用import但我希望webpack也能最小化所有導入的js文件。 這意味着從導入的外部庫中刪除所有未使用的代碼。 這可能嗎。 特別是劇情是一個非常大的圖書館，但我只使用餅圖。 我不認為我的包需要來自劇情的所有代碼。 這是我的webpack配置文件：

const path              = require('path');
const webpack           = require('webpack');
const UglifyJSPlugin    = require('uglifyjs-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');

const config = {
    entry: 
    {
        cash: './js/page/cash.js'
    },
    output: 
    {
        filename: "[name].bundle.js",
        path: path.resolve(__dirname, 'dist')
    },
    resolve: 
    {
        modules: [
            path.resolve(__dirname, 'js')
        ],
        alias : {
            knockout: path.resolve(__dirname, 'js/knockout-3.4.2.js'),
            moment: path.resolve(__dirname,'js/moment.js')
        }
    },
    module: 
    {
        rules: [
            {
                test: /\.js$/, 
                use: 'babel-loader'
            }
        ]
    },
    plugins: [
        new webpack.LoaderOptionsPlugin({
            minimize: true
        }),
        new UglifyJSPlugin({ 
            comments: false,
            sourceMap: false,
            compress: {
                unused: true,
                dead_code: true,
                warnings: false,
                drop_debugger: true,
                conditionals: true,
                evaluate: true,
                drop_console: true,
                sequences: true,
                booleans: true
            },
            mangle: true
        }),
        new webpack.optimize.AggressiveMergingPlugin(),
        new webpack.optimize.OccurrenceOrderPlugin()
    ]
};

module.exports = config;

Answer 1

執行此操作的最佳方法是使用ES6 import 語法有選擇地導入所需的成員（函數）。 Webpack的文檔描述了如何操作。 如果你這樣做，Webpack應該自動執行Tree Shaking。