Nuxt+VuetifyでGoogleフォントやアイコンをローカルから読み込む

公式ではNuxtを使ったやり方が解説されていなかったので調べてみた。

Googleフォントの場合

フォントをインストールする。

yarn add @nuxtjs/google-fonts

下記を追記

  buildModules: [
    //... nuxt.config.js内に下記を追加
    ['@nuxtjs/google-fonts', 
      { families: { Roboto: true }, display: 'block', download: true, inject: true }]
    
  ],

Material design iconsの場合

yarn add @mdi/font

//nuxt.config.js内で下記の箇所を追記
  css: [
    '@mdi/font/css/materialdesignicons.min.css'// css要素に←を追加
  ],