Motivation:
- I need Dynamic Import needed for lazyload Inertia Pages
- I also need
Mix.extract()
function enabled onwebpack.mix.js
in order to separate bundle based on vendor - If we doing both without "mini-css-extract-plugin"
app.css
will be build with 0 bytes.
After tinkering for 2 hours, I find a way how to integrate "mini-css-extract-plugin" to laravel mix. Since this is the root cause of the "0 bytes of css" problem.
Info: My folder structure for resources
├── css
│ └── app.css
├── inertia
│ ├── Components
│ ├── Layouts
│ └── Pages
│ ├── Index.vue
│ └── Login.vue
├── js
│ ├── app.js
│ └── bootstrap.js
├── lang
│ └── en
│ ├── auth.php
│ ├── pagination.php
│ ├── passwords.php
│ └── validation.php
└── views
└── app.blade.php