vuetifyjs-mix-extension
vuetifyjs-mix-extension copied to clipboard
Use with jetstream
Hi i'm try to use vuetify with jetstream. I tried your extension but when apply .vuetify('vuetify-loader') some css from tailwind will not work. Is there anyway to fix this ? My webpack.mix.js
const mix = require('laravel-mix');
require('vuetifyjs-mix-extension');
/*
|--------------------------------------------------------------------------
| Mix Asset Management
|--------------------------------------------------------------------------
|
| Mix provides a clean, fluent API for defining some Webpack build steps
| for your Laravel applications. By default, we are compiling the CSS
| file for the application as well as bundling up all the JS files.
|
*/
mix.js('resources/js/app.js', 'public/js')
.vuetify('vuetify-loader')
.postCss('resources/css/app.css', 'public/css', [
require('postcss-import'),
require('tailwindcss'),
require('autoprefixer'),
])
.webpackConfig(require('./webpack.config'));
if (mix.inProduction()) {
mix.version();
}
Dep
"devDependencies": {
"@inertiajs/inertia": "^0.8.2",
"@inertiajs/inertia-vue": "^0.5.4",
"@tailwindcss/forms": "^0.2.1",
"@tailwindcss/typography": "^0.3.0",
"autoprefixer": "^9.8.6",
"axios": "^0.19",
"cross-env": "^7.0",
"laravel-mix": "^5.0.1",
"lodash": "^4.17.19",
"portal-vue": "^2.1.7",
"postcss-import": "^12.0.1",
"resolve-url-loader": "^3.1.0",
"sass": "^1.32.0",
"sass-loader": "^9.0.0",
"tailwindcss": "npm:@tailwindcss/postcss7-compat@^2.0.1",
"vue": "^2.5.17",
"vue-template-compiler": "^2.6.10",
"vuetify-loader": "^1.6.0",
"vuetifyjs-mix-extension": "^0.0.17"
},
"dependencies": {
"vuetify": "^2.4.0"
}
Screen error

So basically you are using two css frameworks together, I have not tried your setup but I am guessing it's something related to css class names collisions. I will try this when I have time.