3

From like hour ago I keep getting network error on material design icons cdn as error name not resolved.

http://cdn.materialdesignicons.com/5.4.55/css/materialdesignicons.min.css

I am wondering why is nuxt app using cdn instead of downloaded files?

When I try to run npm install nuxt-material-design-icons or npm install material-design-icons it just freezes..

3 Answers 3

6

I figured it out,

Step 1: Add Google fonts icon's CDN.

export default {
  head () {
    return {
      link: [
        // Add this
        { rel: 'stylesheet', href: 'https://fonts.googleapis.com/icon?family=Material+Icons' }
      ],
    }
  }
}

Step 2: Use it (you are done!)

<template>
  // Add this
  <span class="material-icons">face</span>
</template>

Here is the complete list of Material Icons.

2

For Nuxt.js, you will need to install this package:

yarn add nuxt-material-design-icons-iconfont
// Or if you are using npm:
npm install nuxt-material-design-icons-iconfont

And declare that package within nuxt.config.js file:

modules: [
  'nuxt-material-design-icons-iconfont',
],
2
0

Add "nuxt-material-design-icons" in "modules" in nuxt.config.js

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.