我的webpack配置有DefinePlugin定义：

module.exports = env => {
    const PROD = env.production;
    const mode = env.mode || (PROD ? 'production' : 'development');
    const plugins = [
        new LicenseCheckerWebpackPlugin(...),
        new CleanWebpackPlugin(...),
        new webpack.BannerPlugin(...),
        new CopyWebpackPlugin(...),
        new MiniCssExtractPlugin(...),
        new webpack.ProvidePlugin(...),
        new webpack.DefinePlugin({
            DEBUG: JSON.stringify(!PROD),
        }),
        new webpack.NormalModuleReplacementPlugin(...),
        new VueLoaderPlugin(),
        new ESLintPlugin(...),
    ];
    return {
        mode,
        performance: {...},
        entry: {...},
        output: {...},
        optimization: {
            minimize: mode === 'production',
            minimizer: [
                new TerserPlugin({
                    terserOptions: {
                        compress: {
                            drop_console: true,
                        },
                        output: {
                            ascii_only: true,
                        },
                    },
                }),
                new CssMinimizerPlugin(),
            ],
        },
        stats: 'minimal',
        watchOptions: { aggregateTimeout: 200 },
        devtool: mode === 'production' ? false : 'inline-source-map',
        resolve: {...},
        module: {
            rules: [...],
        },
        plugins,
    };
};

JS代码：

import { MyDebugModule } from './my-debug-module';
if (DEBUG) {
    MyDebugModule();
}

在最终的bundle中没有MyDebugModule()的调用，但是当DEBUG是false时，webpack会从my-debug-module.js导入代码。如果我完全删除代码if (DEBUG) { MyDebugModule(); } webpack将删除my-debug-module代码。

[email protected]

sideEffects不影响导入的模块。Upd.实际上，在我的情况下是错误的。