Problem with Quasar integration

[xusimr97]

The error occurs when integrating the nuxt-booster module into a Nuxt.js project that uses the Quasar framework with Vite and Sass for CSS preprocessing. The addition of nuxt-booster triggers a Sass compilation error related to an invalid syntax in the quasar.sass file.

[plugin:vite:css] [sass] expected "$". ╷ 7476 │ @each $heading, "$typography-font-family │ ^ ╵ node_modules/quasar/dist/quasar.sass 7476:17 root stylesheet /app/node_modules/quasar/dist/quasar.sass:7483:14 at Object.wrapException (/app/node_modules/sass/sass.dart.js:2161:43) at SpanScanner.error$3$length$position (/app/node_modules/sass/sass.dart.js:79808:15) at SpanScanner._fail$1 (/app/node_modules/sass/sass.dart.js:79947:12) at SpanScanner.expectChar$2$name (/app/node_modules/sass/sass.dart.js:79889:12) at SpanScanner.expectChar$1 (/app/node_modules/sass/sass.dart.js:79892:19) at SassParser0._stylesheet0$_eachRule$2 (/app/node_modules/sass/sass.dart.js:111714:12) at SassParser0.atRule$2$root (/app/node_modules/sass/sass.dart.js:111451:24) at SassParser0._stylesheet0$_statement$1$root (/app/node_modules/sass/sass.dart.js:111107:22) at StylesheetParser_parse__closure1.call$0 (/app/node_modules/sass/sass.dart.js:114403:17) at SassParser0._sass0$_child$1 (/app/node_modules/sass/sass.dart.js:107282:20) at SassParser0.statements$1 (/app/node_modules/sass/sass.dart.js:107246:21) at StylesheetParser_parse_closure0.call$0 (/app/node_modules/sass/sass.dart.js:114387:23) at SassParser0.wrapSpanFormatException$1$1 (/app/node_modules/sass/sass.dart.js:106558:25) at SassParser0.wrapSpanFormatException$1 (/app/node_modules/sass/sass.dart.js:106610:19) at SassParser0.parse$0 (/app/node_modules/sass/sass.dart.js:111091:19) at Object.Stylesheet_Stylesheet$parse0 (/app/node_modules/sass/sass.dart.js:29271:135) at /app/node_modules/sass/sass.dart.js:19605:30 at _wrapJsFunctionForAsync_closure.$protected (/app/node_modules/sass/sass.dart.js:4900:15) at _wrapJsFunctionForAsync_closure.call$2 (/app/node_modules/sass/sass.dart.js:35592:12) at Object._asyncStartSync (/app/node_modules/sass/sass.dart.js:4864:20) at Object.compileStringAsync0 (/app/node_modules/sass/sass.dart.js:19625:16) at /app/node_modules/sass/sass.dart.js:26776:38 at _wrapJsFunctionForAsync_closure.$protected (/app/node_modules/sass/sass.dart.js:4900:15) at _wrapJsFunctionForAsync_closure.call$2 (/app/node_modules/sass/sass.dart.js:35592:12) at Object._asyncStartSync (/app/node_modules/sass/sass.dart.js:4864:20) at Object._renderAsync (/app/node_modules/sass/sass.dart.js:26835:16) at StaticClosure.render (/app/node_modules/sass/sass.dart.js:26731:11) at Object.Primitives_applyFunction (/app/node_modules/sass/sass.dart.js:2049:30) at Object.Function_apply (/app/node_modules/sass/sass.dart.js:6315:16) at _callDartFunctionFast (/app/node_modules/sass/sass.dart.js:8174:16) at sass.render (/app/node_modules/sass/sass.dart.js:8152:18) at eval (eval at FakeWorker (file:///app/node_modules/vite/dist/node/chunks/dep-NjL7WTE1.js:19621:16), <anonymous>:30:14) at new Promise (<anonymous>) at FakeWorker.eval [as _fn] (eval at FakeWorker (file:///app/node_modules/vite/dist/node/chunks/dep-NjL7WTE1.js:19621:16), <anonymous>:29:14) at FakeWorker.run (file:///app/node_modules/vite/dist/node/chunks/dep-NjL7WTE1.js:19625:25) at WorkerWithFallback.run (file:///app/node_modules/vite/dist/node/chunks/dep-NjL7WTE1.js:19665:58) at Object.process (file:///app/node_modules/vite/dist/node/chunks/dep-NjL7WTE1.js:37505:37) at async compileCSSPreprocessors (file:///app/node_modules/vite/dist/node/chunks/dep-NjL7WTE1.js:36681:28) at async compileCSS (file:///app/node_modules/vite/dist/node/chunks/dep-NjL7WTE1.js:36735:32) at async TransformPluginContext.transform (file:///app/node_modules/vite/dist/node/chunks/dep-NjL7WTE1.js:36131:11) at async PluginContainer.transform (file:///app/node_modules/vite/dist/node/chunks/dep-NjL7WTE1.js:48974:18) at async loadAndTransform (file:///app/node_modules/vite/dist/node/chunks/dep-NjL7WTE1.js:51796:27) at async viteTransformMiddleware (file:///app/node_modules/vite/dist/node/chunks/dep-NjL7WTE1.js:61750:24

[ThornWalli]

Hello @xusimr97,

can you provide a repo for reproduction?

I was able to test it successfully with the Playground from https://github.com/Maiquu/nuxt-quasar.

And you could also deactivate fontaine for testing.

https://basics.github.io/nuxt-booster/guide/options.html#disablenuxtfontaine

Maybe that will help.

[xusimr97]

Unfortunately, I can't share the repository due to client restrictions, but I found that deactivating Fontaine resolved the issue. I was surprised by this because I have another project using Nuxt and Quasar where everything works fine.

Thanks a lot

[ThornWalli]

Very good 🙂

Then I'll close the issue, then this is a problem of @nuxtjs/fontaine.