Question

我使用laravel-mix（包括webpack）来捆绑JS文件。使用BundleAnalyzerPlugin我发现我的输出文件包含多个JQuery lib副本，这会增加输出文件的大小。

它自己连接几个包含JQuery的模块。

任何想法如何避免这种情况并删除所有多余的jquery包含？

（更新信息更新）

webpack.mix.js

const { mix } = require('laravel-mix');
const webpack = require('webpack');

const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;

mix.js('resources/assets/js/admin.js', 'public/js')

mix.webpackConfig({
    plugins: [
        new BundleAnalyzerPlugin(),
        new webpack.ProvidePlugin({ // Added as a suggestion. Makes no difference
            '$': 'jquery',
            'jQuery': 'jquery',
            'window.jQuery': 'jquery'
        })
    ],
});

admin.js

import 'jquery'
import 'toastr'

Answer 1

在您的条目文件中

import 'jquery'并将以下块添加到您的webpack.config

plugins: [
    new webpack.ProvidePlugin({
      '$': 'jquery',
      'jQuery': 'jquery',
      'window.jQuery': 'jquery'
    })
]

参考：Webpack Provide Plugin

如何避免相同的模块重复Webpack捆绑？

1 个答案: