NuxtのVuetifyでdefaultAssetsをなくしてMaterial Designのリソースを読み込まなくする

Vuetifyはデフォルトの設定でMaterial Designのリソースを読み込む設定がされています。

これがSEOという観点から見ると読み込みに結構時間を要します

マテリアルデザインの機能を使っている場合は致し方ないところもありますが、 もし使っていない場合はオフにする事でページの読み込み速度が速くなります。

マテリアルデザインの読み込みを設定する defaultAssets をオフにする方法について記載します。

defaultAssetsをオフにする

結論 defaultAssets に false を設定すればオフに出来ます！

そのまんまですね。笑

export default {
  vuetify: {
    defaultAssets: false,
  }

defaultAssetsではフォントとiconを設定する事が出来て、もしどちらか片方をオフにする場合はオフにしたい項目に false を設定すればOK！

export default {
  vuetify: {
    defaultAssets: {
      font: false,
      icons: false
    }
  }

注意点としては当然ながらVuetifyがこれらのアイコンを使っているコンポーネントがあること。 闇雲にオフにするとどこかに影響が出ている可能性があります。

私の環境だとページャーの前後の記事に移動するためのアイコンがなくなってました。。😅笑

デフォルト値について（余談）

defaultAssets のデフォルト値は以下のようになっています

export default {
  vuetify: {
    defaultAssets: {
      font: {
        family: 'Roboto'
      },
      icons: 'mdi'
    }
  }

iconsにはこちらの値が設定出来ます、Font Awesomeも選択出来るんですね。