Nuxt+Vuetifyのサイトでダークテーマを外す


本当にちょっとしたことですが、調べるのに15分くらいかかってしまったので記事化。

Nuxt.jsでVuetifyを適用したサイトを作成すると、デフォルトではダークテーマが適用されます。
こんな感じで。

nuxt.config.jsでvuetify.theme.darkの設定をfalseに変更すれば、ダークテーマを解除できます。

  • 変更前
nuxt.config.js
  vuetify: {
    customVariables: ['~/assets/variables.scss'],
    theme: {
      dark: true,
(略)
  • 変更後
nuxt.config.js
  vuetify: {
    customVariables: ['~/assets/variables.scss'],
    theme: {
      dark: false,
(略)

このようになりました。

以上です。