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 syntax有选择地导入所需的成员（函数）。 Webpack's documentation描述了如何。如果你这样做，Webpack应该自动进行Tree Shaking。

使用webpack2最小化捆绑包

1 个答案: