nuxt-community / vuetify-module

Vuetify Module for Nuxt 2
Other
627 stars 106 forks source link

All vuetify theme classes are missing including: primary, secondary, accent, error, info, success, warning #238

Open kpturner opened 4 years ago

kpturner commented 4 years ago

Module version 1.9.1

Describe the bug Upgrading from vuetify 1.x in a nuxt app (2.8) and decided to use vuetify-module to simplify matters. Standard vanilla install. However when I run the app there do not seem to be any of the standard colour classes (primary, secondary, accent, error, info, success, warning ) in the deployment. Any other colour works fine, but components (buttons mainly) that use these standard theme colours remain colourless. I have no idea what I may have missed. My config in nuxt.config is as follows

modules: [
        ['@nuxtjs/vuetify', {
            theme: {
                dark: false
            }
        }]
nfunwigabga commented 4 years ago

Having the same problem with "@nuxtjs/vuetify": "^1.9.1". Color classes (primary, secondary, error etc) not applied, but red, blue etc available.

kpturner commented 4 years ago

Actually it is more than that - the entire vuetify-theme-stylesheet is missing. I have had to duplicate it in the assets folder and then include it myself in the css section of nuxt-config

css: [
        '~/assets/vuetify-theme-stylesheet.css'
    ],

but surely this shouldn't be necessary? The default theme should be included in the module.

kevinmarrec commented 4 years ago

It's really weird cause if you clone the vuetify-module project, install dependencies and run yarn dev, you'll be able to see that primary color works.

kevinmarrec commented 4 years ago

@kpturner @nfunwigabga Could someone provide repository with the bug and instructions to reproduce thanks.

kpturner commented 4 years ago

My repository is private - and is also very big and requires complicated setup. It wouldn't be practical to share that but I will try to get a simple cut down example for you......unless @nfunwigabga has a ready made example

kpturner commented 4 years ago

Try this (simple nuxt 2.8 scaffold): https://github.com/kpturner/nuxt-vuetify-bug.git

nfunwigabga commented 4 years ago

I upgraded Nuxt.js to the latest version 2.11.0 and now the colors are all working as expected.

kpturner commented 4 years ago

Nevertheless it should work with nuxt <2.9.0

MartinMuzatko commented 4 years ago

I always have this problem. Even with latest module and nuxt versions. in dev mode it works, but ssr/ssg does not work.

MartinMuzatko commented 4 years ago

I have a very tiny repo where you can reproduce the problem:

Repo: https://github.com/MartinMuzatko/athalon-character-creator/tree/443cb6b10b1ef7d4e8818e9d6bf22d813f0afff2 Web: https://5edc1012cd525f000805e66f--athalon-charactor-creator.netlify.app/

MartinMuzatko commented 4 years ago

@kpturner can you please post where you retrieved the stylesheet from to manually embed? Shouldn't it generate based on the colors you provide? Or is there a basic stylesheet independent from settings?

MartinMuzatko commented 4 years ago

I found that tailwindcss is part of the problem. Once included as buildModule (@nuxt/tailwindcss) I don't get the vuetify stylesheet anymore.. maybe some postcss loader removes it?