# Nuxt JS Framework

How to use external resources, on all pages or on a particular page? <script>, <link> tags?

Add head Object

Also possible to add external resource at the end of body using body: true

<script>
export default {
  head() {
    return {
      script: [
        { src: 'https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js' }
      ],
      link: [
        { rel: 'stylesheet', href: 'https://fonts.googleapis.com/css?family=Roboto&display=swap' }
      ]
    }
  }
}
</script>

how to use route guards with nuxt?

Using nuxt middlewares

Does nuxt uses lazy route loading like vue-router?

It's likely preloaded, which is a benefit rather than a disadvantage.

That means that components for the current route are loaded first, then the other components will be preloaded/prefetched.

But you can disable that behavior if you need to.

Code splitting and lazy loading already work out of the box as you described it.

Stop prefetching

How to use and add google fonts in project?

Use google fonts

link: [
  { rel: 'stylesheet',
    href: 'https://fonts.googleapis.com/css?family=Montserrat:300,600|PT+Serif&display=swap'
  }
]

← Node Package Manager Presentations →