Laravel mix is taking more than 5 minutes to compile in laravel8 and vue2 project

I am lazy loading components in app.js like: 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'));

There are total 82 components in app.js while others nested components are loaded in within the required components. It takes more than 5 minutes to compile. This is my webpack.mix.js file:

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 Core stylesheets mixAssetsDir('sass/base/plugins/**/!()*.scss', (src, dest) => mix.sass(src, dest.replace(/(|/)sass(|/)/, '$1css$2').replace(/.scss$/, '.css'), {sassOptions}) )

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

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

// script js 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() .sourceMaps(false); }