How to make different builds for the front and admin using laravel-mix and at the same time use dynamic imports?

Question

Laravel

Good day!

The idea is this - a project on laravel, admin panel on vue, front on blades. Accordingly, as I understand it, in webpack.mix.js, you need to separate assets for the admin panel and for the front. At the moment, I encountered a problem that if I use dynamic import in the router, then the styles for the app.css front are not collected, and at the same time they have a strange chunk name

import Vue from 'vue';
import VueRouter from 'vue-router';

Vue.use(VueRouter);

const routes = [
  {
    path: '',
    component: () => import('../views/Users/index'), // с динамическим импортом
  },
];

const router = new VueRouter({
  mode: 'history',
  base: '/admin',
  routes,
});

export default router;

If I do not use dynamic import, then everything is ok:

import Vue from 'vue';
import VueRouter from 'vue-router';
import Layout from '../layout';

Vue.use(VueRouter);

const routes = [
  {
    path: '',
    component: Layout, // без динамического импорта
  },
];

const router = new VueRouter({
  mode: 'history',
  base: '/admin',
  routes,
});

export default router;

// webpack.mix.js
const mix = require('laravel-mix');


mix.js('resources/assets/js/app.js', 'public/dist') // фронт
        .js('resources/assets/js/admin/app.js', 'public/dist/admin') // админка
        .sass('resources/assets/sass/app.scss', 'public/dist'); // стили для фронта

I can't figure out what the problem is. I ask to prompt if who knows where to dig and/or faced similar. Thanks in advance!