Skip to content

Efficient web font loading has never been easier!

License

Notifications You must be signed in to change notification settings

reilnuud/nuxt-webfontloader

 
 

Repository files navigation

Nuxt Webfontloader - Efficient web font loading has never been easier!

npm (scoped with tag) npm Build Status codecov Dependencies js-standard-style thanks

📖 Release Notes

Features

  • Full support of SVGs as components. Import them like your Vue SFCs
  • Built on top of Google's/Typekit's webfontloader
  • Improves site performance by loading web-fonts asynchronously
  • Nuxt 2 (and only Nuxt 2) support
  • Fully tested!

Setup

  • Add nuxt-webfontloader as a dependency using yarn or npm to your project
  • Add nuxt-webfontloader to modules section of nuxt.config.js
{
  modules: [
    'nuxt-webfontloader',
  ],
}
  • Include your webfontloader options in the nuxt.config.js, for example:
export default {
  webfontloader: {
    google: {
      families: ['Lato:400,700'] //Loads Lato font with weights 400 and 700
    }
  },
}
  • Remove old stylesheets from your app template or nuxt.config.js head part:
export default {
  head:{
    link: [
      // You don't need that line anymore!
      { rel: 'stylesheet', href: 'https://fonts.googleapis.com/css?family=Lato:400,700' }
    ]
  }
}

Development

  • Clone this repository
  • Install dependencies using yarn install or npm install
  • Start development server using npm run dev

License

MIT License

Copyright (c) Alexander Lichter

About

Efficient web font loading has never been easier!

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 94.4%
  • Vue 5.6%