Nuxt + Vuetify。テーマカラーを適用する方法

Nuxt.js + Vuetify.jsプロジェクトを使用しています

ファイルを見るassets/style/app.styl 我々は持っています

// Import and define Vuetify color theme
// https://vuetifyjs.com/en/style/colors
@require '~vuetify/src/stylus/settings/_colors'
$theme := {
  primary:     $blue.darken-2
  accent:      $blue.accent-2
  secondary:   $grey.lighten-1
  info:        $blue.lighten-1
  warning:     $amber.darken-2
  error:       $red.accent-4
  success:     $green.lighten-2
}

// Import Vuetify styling
@require '~vuetify/src/stylus/main'

.page
  @extend .fade-transition

問題は、これらのテーマの色を変更しても何も変更されないことです。

これを解決する方法はありますか？

vue.jsvuetify.jsnuxt.js

2019/05/10isebarn

解決策は簡単です。

これを管理する2つのファイル-nuxt.config.jsおよびnode_modules/vuetify/es5/colors.js。

nuxt.config.jsを開き、vuetifyプロパティに移動する必要があります。 vuetify: {...}セクションのthemesプロパティを使用すると、クラス名を構成済みの色変数にマップできます。

さらに、カラー変数の値を変更するには、ファイルnode_modules/vuetify/es5/colors.jsを変更します。ここでは、必要な16進数のカラーコードに必要な色を定義します。

2020/01/26roshnet