search

vuetifyjs / nuxt-module

Zero-config Nuxt Module for Vuetify
https://nuxt.vuetifyjs.com/
MIT License
216 stars 22 forks source link

Vuetify styles configFile with settings and SSR breaks nuxt generate #78

Closed jrutila closed 1 year ago

jrutila commented 1 year ago

Reproduce: Create a settings.scss file with settings (see https://github.com/vuetifyjs/vuetify-loader/tree/master/packages/vite-plugin#style-loading)

@use 'vuetify/settings' with
  ($utilities: false, $button-height: 40px, $label-font-size: 0.7rem);

Set this settings file to vuetify-nuxt-module moduleOptions and enable SSR:

export default defineNuxtConfig({
  ssr: true,
  modules: ['vuetify-nuxt-module'],

  vuetify: {
    moduleOptions: {
      styles: { configFile: '/settings.scss' },
    },
  },
})

Run nuxt generate. Following error is happening, when the server is built:

Nuxi 3.6.5                                                                                                                                                                      
Nuxt 3.6.5 with Nitro 2.5.2    
...  
ℹ Building server...                                                                                                                                                         
ℹ vite v4.3.9 building SSR bundle for production...                                                                                                                     
ℹ ✓ 374 modules transformed.                                                                                                                                                  
ℹ ✓ built in 15.32s                                                                                                                                                            

ERROR  [vite:load-fallback] Could not load /plugin-vuetify/lib/components/VMessages/VMessages.sass?inline&used: ENOENT: no such file or directory, open '/plugin-vuetify/lib/components/VMessages/VMessages.sass?inline&used'
ERROR  Could not load /plugin-vuetify/lib/components/VMessages/VMessages.sass?inline&used: ENOENT: no such file or directory, open '/plugin-vuetify/lib/components/VMessages/VMessages.sass?inline&used'
ELIFECYCLE  Command failed with exit code 1.

This StackBlitz reproduces the problem: https://stackblitz.com/edit/github-p6ty8t?file=playground%2Fnuxt.config.mts

Workaround: No workaround found, yet. Disabling SSR does not cause the problem.

userquin commented 1 year ago

@jrutila disable experimental.inlineSSRStyles = false in your nuxt config file

jrutila commented 1 year ago

Cool, that worked, thanks! I added a mention about this to the docs: https://github.com/userquin/vuetify-nuxt-module/pull/79