question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Hello guys! I tried to add the plugin into a NUXT3 app using vite, but it seems not to be working. Am I doing something wrong? I’m using the latest version (RC4) from Nuxt3. My nuxt.config.ts is like this:

import { defineNuxtConfig } from 'nuxt'
import { VitePluginFonts } from 'vite-plugin-fonts'

export default defineNuxtConfig({

  vite: {
    plugins: [
      VitePluginFonts({
        google: {
          families: [{name:'Barlow', styles:'wght@100;300;400'}]
        },
      })
    ]
  }

})

Issue Analytics

  • State:closed
  • Created a year ago
  • Comments:7 (2 by maintainers)

github_iconTop GitHub Comments

1reaction
stafyniaksachacommented, Aug 8, 2022

For nuxt and google font you can use this:

import { defineNuxtConfig } from 'nuxt'

export default defineNuxtConfig({
  app: {
    head: {
      link: [
        { rel: 'preconnect', href: 'https://fonts.googleapis.com' },
        {
          rel: 'preconnect',
          href: 'https://fonts.gstatic.com',
          crossorigin: true,
        },
        {
          rel: 'stylesheet',
          href: 'https://fonts.googleapis.com/css2?family=Roboto+Flex:wght@200..800&display=swap',
        },
      ],
    },
  },
})
1reaction
rwwagner90commented, Aug 8, 2022

I just manually added my fonts to the app.head config for now. @pisandelli do you have an example to share of how to make this work?

Read more comments on GitHub >

github_iconTop Results From Across the Web

Nuxt: The Intuitive Web Framework
Build your next Vue.js application with confidence using Nuxt. An open source framework under MIT license that makes web development simple and powerful....
Read more >
Nuxt - The Intuitive Vue Framework
Build your next Vue.js application with confidence using Nuxt. An open source framework making web development simple and powerful.
Read more >
Nuxt 3 support : WEB-54200
To support Nuxt 3 we need: WEB-53890 - index d.ts files in .nuxt folder; WEB-54199 - recognize GlobalComponents Vue 3 interface; remove special...
Read more >
Modules support status · Discussion #751 · nuxt/framework
Currently, we are trying hard to make the bridge module more stable and provide tooling and documentation for module authors in order to...
Read more >
Nuxt (@nuxt_js) / Twitter
One of the core features of Nuxt 3 is the layers system Extend a default Nuxt ... Features Support nuxt v3 rc.11 -...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found