How to use it for some pege ?

[golubvladimir]

I want to use Open Sans font only on some pages. How to set it in settings ?

[GnApollo]

'Open Sans' : true

[aleavikraman]

After adding 'Open+Sans': true to your googleFonts options in nuxt.config.ts, you can then add the font as a class in your pages.

.some-class { font-family: 'Open Sans', sans-serif; }

[danieldanielecki]

After adding 'Open+Sans': true to your googleFonts options in nuxt.config.ts, you can then add the font as a class in your pages.

.some-class { font-family: 'Open Sans', sans-serif; }

confirm, it's working (missed that in the docs, too), this issue should've been closed.

[ricardogobbosouza]

With nuxt 3 we can request stylesheets in different routes

[ricardogobbosouza]

It's still an improvement that needs to be implemented

[GnApollo]

'Open Sans' : true

Sorry, maybe this is not clear.

for future reference on Nuxt 2. Here's how I do it.

nuxt.config.js

buildModules : {
....
  ['@nuxtjs/google-fonts', {
      families: {
        Roboto: true,
        'Open Sans' : true
      }
    }],
...
}

if you're using tailwindcss

tailwind.config.js

module.exports = {
  important: true,
  content: [
    './components/**/*.{vue,js}',
    './layouts/**/*.vue',
    './pages/**/*.vue',
    './plugins/**/*.{js,ts}',
    './nuxt.config.{js,ts}',
  ],
  theme: {
    extend: {
      fontFamily: {
        'rob': ['Roboto'],
        'sans': ['Open Sans']
      },

    },
  }
}

then you can use it on your HTML as CSS.

<template>
    <p class="font-rob">Roboto Font</p>
    <p class="font-sans">Open Sans Font</p>
</template>

<script>
export default {}
</script>