Webpack 3加载模块两次

Question

我正在使用Webpack 3作为我的应用程序的模块加载器。但是当我分析我的vendor.js包时，我看到d3在那里加载了两次 - 一次是一个单独的模块，一次是依赖。如何才能加载一次？

我尝试了这些，但没有奏效：

• 将其添加为别名
• 在CommonsChunkPlugin中添加

这是我的webpack配置文件：

var webpack = require('webpack'),
    HtmlWebpackPlugin = require('html-webpack-plugin'),
    autoprefixer = require('autoprefixer'),
    WebpackNotifierPlugin = require('webpack-notifier'),
    ngAnnotatePlugin = require('ng-annotate-webpack-plugin'),
    path = require('path'),
    bourbon = require('bourbon').includePaths,
    BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
var ENV = process.env.npm_lifecycle_event;
var isProd = false;

module.exports = {
    cache: true,
    entry: {
        // vendor: [
        //     'angular',
        //     'jquery',
        //     'velocity-animate',
        //     'highcharts',
        //     'd3',
        //     'rickshaw',
        //     'angular-block-ui',
        //     'angular-sanitize',
        //     'angular-animate',
        //     'angular-cookies',
        //     './Private/Scripts/app/session/session.module',
        //     'jquery.viewport',
        //     'oclazyload',
        //     'angular-ui-router',
        //     'moment',
        //     'bootstrap/js/tooltip'
        // ],
        wealth: './Private/Scripts/app/wealth/bootstrap.ts',
        goal: './Private/Scripts/app/goal/bootstrap.ts',
        login: './Private/Scripts/app/login/login.bootstrap.ts',
        register: './Private/Scripts/app/register/register.bootstrap.ts',
        dashboard: './Private/Scripts/app/dashboard/bootstrap.ts',
        personal: './Private/Scripts/app/personal/bootstrap.ts',
        resetPassword: './Private/Scripts/app/reset-password/reset-password.bootstrap.ts',
        forgottenPassword: './Private/Scripts/app/forgotten-password/forgotten-password.bootstrap.ts',
        products: './Private/Scripts/app/products/products.bootstrap.ts',
        onboarding: './Private/Scripts/app/onboarding/onboarding.bootstrap.ts',
        portfolio: './Private/Scripts/app/portfolio/bootstrap.ts',
        investments: './Private/Scripts/app/investments/bootstrap.ts',
        savings: './Private/Scripts/app/savings/bootstrap.ts',
        customerIdentification: './Private/Scripts/app/customer-identification/customer-identification.bootstrap.ts',
        wealthCoach: './Private/Scripts/app/wealth-coach/wealth-coach.bootstrap.ts',
        shared: './Private/Scripts/app/shared/shared.bootstrap.ts',
        riskTest: './Private/Scripts/app/risk-test/module.ts',
        riskProfile: './Private/Scripts/app/risk-profile/bootstrap.ts',
        upgradeProduct: './Private/Scripts/app/upgrade/upgrade.bootstrap.ts',
        pendingActivation: './Private/Scripts/app/pending-activation/pending-activation.bootstrap.ts',
        meeting: './Private/Scripts/app/meeting/meeting.bootstrap.ts'
    },

    output: {
        path: __dirname + '/Private/build',
        filename: 'scripts/[name].js',
        publicPath: '/Private/build/'
    },

    devtool: 'eval',

    resolve: {
        extensions: ['.webpack.js', '.web.js', '.ts', '.js'],
        alias: {
            config: path.join(__dirname, "/Private/Scripts/app/config/", process.env.npm_lifecycle_event),
            d3: path.resolve('./node_modules/d3'),
        }

    },

    module: {
        rules: [
            {
                test: /\.ts$/,
                exclude: /node_modules/,
                use: 'ts-loader'
            },
            {
                test: /\.scss$/,
                use: [
                    'file-loader?name=styles/[name].css',
                    'extract-loader',
                    'css-loader',
                    {
                        loader: 'postcss-loader',
                        options: {
                            plugins: function () {
                                return [
                                    require('autoprefixer')
                                ];
                            }
                        }
                    },
                    // {
                    //     loader: 'fast-sass-loader',

                    // }
                    {
                        loader: 'sass-loader',
                        options: {
                            sourceComments: false,
                            outputStyle: "compressed",
                            includePaths: [require('bourbon').includePaths]
                        }
                    }
                ]
            },
            {
                test: /\.woff(2)?(\?[a-z0-9]+)?$/,
                use: ['url-loader?name=styles/fonts/[name].[ext]']
            },
            {
                test: /\.(ttf|eot|svg|otf)(\?[a-z0-9]+)?$/,
                use: ['file-loader?name=styles/fonts/[name].[ext]']
            },
            {
                test: /\.json$/,
                use: 'json-loader'
            }
        ]
    },

    node: {
        fs: 'empty'
    },

    plugins: [
        new ngAnnotatePlugin({
            add: true
        }),
        new webpack.ProvidePlugin({
            $: 'jquery',
            jQuery: 'jquery',
            'window.jQuery': 'jquery',
            'humanizeDuration': 'humanize-duration',
            'moment': 'moment',
            CONFIG: 'config'
        }),
        new WebpackNotifierPlugin({
            excludeWarnings: true,
            alwaysNotify: true
        }),
        new webpack.optimize.CommonsChunkPlugin({
            name: 'vendor',
            filename: 'vendor.js',
            minChunks(module, count) {
                var context = module.context;
                return context && context.indexOf('node_modules') >= 0;
            },
        }),
        new webpack.DefinePlugin({
            PRODUCTION: JSON.stringify(isProd)
        }),
        new webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, /de|en/),
        new webpack.optimize.ModuleConcatenationPlugin(),
        new BundleAnalyzerPlugin()
    ]
};