CODEWITHSUNDEEP
vue.jsquasar-framework
Jackie
Jackie

Reputation: 23577

How do I turn on Quasar dark mode for a Vue3 App on all components?

I have the following...

import { Quasar, Dark } from "quasar";
...
Dark.set(true);

async function startApp() {
    const app = createApp(App);
    ...
    app.use(Quasar, {
        plugins: {}, // import Quasar plugins and add here
    });
    app.mount("#app");
}

startApp().then(()=>{
    console.log("SPA started");
})

But it isn't setting the project to dark. What am I missing? I am using the <script setup> syntax for my component so whatever solution would need to work with that setup.

Upvotes: 0

Views: 1401

Answers (1)

Raeisi
Raeisi

Reputation: 2181

You can pass dark: true as an option of Quasar's plugin during registration.

app.use(Quasar, {
  plugins: {}, // import Quasar plugins and add here  
  config: {
    dark: true,
  },
});

Upvotes: 3

Related Questions