使用异步Vue组件时Laravel Mix出现问题

Question

说明：

Laravel-Mix版本：5

我的webpack.mix.js文件：

const mix = require('laravel-mix');
require('laravel-mix-purgecss');
const tailwindcss = require('tailwindcss');


mix.js('resources/assets/js/app.js', 'assets/js')
    .sass('resources/assets/sass/app.scss', 'assets/css')
    .sass('resources/assets/sass/vendor.scss', 'assets/css')
    .copy('resources/assets/images', 'assets/images')
    .options({
        processCssUrls: false,
        postCss: [tailwindcss('./tailwind.config.js')],
    })
    .extract()
    .purgeCss()
    .browserSync('http://localhost:8080');

我创建了一些Vue组件，并尝试将它们作为异步组件包括进来：

import Vue from 'vue'
import App from './App.vue'
import Router from 'vue-router'

const Dashboard = () => import(/* webpackChunkName: "./assets/js/dashboard" */ './components/Dashboard')
const DashboardHome = () => import(/* webpackChunkName: "./assets/js/dashboard" */ './pages/Home')

import store from './store'


Vue.config.productionTip = false

Vue.use(Router)

const routes = [
  { path: '/', redirect: { name: 'DashboardHome' } },
  { path: '/dashboard', component: Dashboard, children: [
      { path: '/', redirect: { name: 'DashboardHome' } },
      { path: 'home', name: 'DashboardHome', component: DashboardHome }
    ]
  }
]

const router = new Router({
  mode: 'hash',
  routes
})

new Vue({
  render: h => h(App),
  router,
  store
}).$mount('#app')

已创建文件（js / css），但运行yarn run prod时css文件包含JS代码

https://www.dropbox.com/s/osakt96rgl83sx0/Screenshot%202020-06-08%2022.28.51.png?dl=0

https://www.dropbox.com/s/iw744tfq30xt1v2/Screenshot%202020-06-08%2022.29.19.png?dl=0

如何解决此问题？