2

我有一个大的 app.js 和 vendor.js 文件,为了减小我选择将它们分成块的方法的大小。

当我运行 webpack 时,它会创建许多分块文件,但我不知道如何在刀片布局中导入它们。

我尝试在网上研究它,但我能找到的只是拆分它们的方法,没有显示如何链接这些拆分的文件。

我想到的唯一想法是读取 mix-manifest.json 文件,遍历它,然后将它们链接到刀片中,但这对我来说似乎不是一个好的解决方案。

她的我的 Webpack 配置

mix.setPublicPath('public/');
mix.webpackConfig({
    watchOptions: {
        ignored: /node_modules/
    },
    optimization :  {
        splitChunks: {
            chunks: "all",
            minSize: 200000,
            maxSize: 244000,
        }
    }
}).js('resources/js/app.js', 'public/js')
    .extract(['vue', 'jquery', 'bootstrap', '@coreui/vue'])
    .extract(['@coreui/coreui', '@coreui/icons'], 'js/vendor~utils-2.js')
    .extract()
    .sass('resources/sass/app.scss', 'public/css')
    .version();

这就是我如何链接我以前的 JS 脚本

<script src={{mix('/js/manifest.js')}}}></script>
<script src={{mix('/js/vendor.js')}}}></script>
<script src="{{ mix('/js/app.js') }}"></script>

这些是 webpack 在我的 public/js 文件夹中创建的块 以下是 webpack 创建的块

4

0 回答 0