Permalink
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
53 lines (43 sloc) 957 Bytes
title description
External resources
How to use external resources with Nuxt.js?

How to use external resources?

Global Settings

Include your resources in the nuxt.config.js file:

module.exports = {
  head: {
    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' }
    ]
  }
}

Local Settings

Include your resources in your .vue file inside the pages/ directory:

<template>
  <h1>About page with jQuery and Roboto font</h1>
</template>

<script>
export default {
  head: {
    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' }
    ]
  }
}
</script>

<style scoped>
h1 {
  font-family: Roboto, sans-serif;
}
</style>