使用 laravel mix 编译 Vue 组件需要 5 分钟以上

Question

` 我在 resources/app.js 中使用延迟加载方法导入 vue 组件（使用 Laravel@8 和 Vue@2）：

Vue.component('contact-us-component', () => import('./components/ContactUsComponent.vue'));
Vue.component('home-component', () => import('./components/HomeComponent.vue'));
Vue.component('post-component', () => import('./components/PostComponent.vue'));

app.js 中共有 82 个组件，其他嵌套组件在所需组件中加载。

编译需要5分钟多。 这是我的 webpack.mix.js 文件：

const mix = require('laravel-mix')
const exec = require('child_process').exec
require('dotenv').config()


const glob = require('glob')
const path = require('path')

function mixAssetsDir(query, cb) {
    ;(glob.sync('resources/' + query) || []).forEach(f => {
        f = f.replace(/[/]+/g, '/')
        cb(f, f.replace('resources', 'public'))
    })
}

const sassOptions = {
    precision: 5,
    includePaths: ['node_modules', 'resources/assets/']
}

plugins 核心样式表 mixAssetsDir('sass/base/plugins/**/!()*.scss', (src, dest) => mix.sass(src, dest.replace(/(|/)sass(|/)/, '$1css$2').replace(/.scss$/, '.css'), {sassOptions}) )

pages 核心样式表 mixAssetsDir('sass/base/pages/**/!(_)*.scss', (src, dest) => mix.sass(src, dest.replace(/(|/)sass(|/)/, '$1css$2').replace(/.scss$/, '.css'), {sassOptions}) )

核心样式表 mixAssetsDir('sass/base/core/**/!(_)*.scss', (src, dest) => mix.sass(src, dest.replace(/(|/)sass(|/)/, '$1css$2').replace(/.scss$/, '.css'), {sassOptions}) )

脚本 mixAssetsDir('js/scripts/**/*.js', (src, dest) => mix.scripts(src, dest))

mixAssetsDir('vendors/js/**/*.js', (src, dest) => mix.scripts(src, dest))
mixAssetsDir('vendors/css/**/*.css', (src, dest) => mix.copy(src, dest))
mixAssetsDir('vendors/css/editors/quill/fonts/', (src, dest) => mix.copy(src, dest))
mixAssetsDir('fonts', (src, dest) => mix.copy(src, dest))
mixAssetsDir('fonts/**/**/*.css', (src, dest) => mix.copy(src, dest))

mix
    .js('resources/js/core/app-menu.js', 'public/js/core')
    .js('resources/js/core/app.js', 'public/js/core')
    .js('resources/js/app.js', 'public/js').vue() **// This line takes whole time**
    .sass('resources/sass/app.scss', 'public/css')
    .sass('resources/sass/core.scss', 'public/css', {sassOptions})
    .sass('resources/sass/overrides.scss', 'public/css', {sassOptions})
    .sass('resources/assets/scss/style.scss', 'public/css', {sassOptions})
    .options({
        processCssUrls: false
    });

if(mix.inProduction()) {
    mix.version();
}

我在阅读 laravel mix 时尝试了一切，但没有任何效果。

https://laravel-mix.com/docs/6.0/installation````