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.

Icons show the text of the icons, not the icon itself.

See original GitHub issue

Steps to reproduce

Install a webpack base project using vue-cli
Install Vue, include the JS/CSS into the Vue App in main.js.
At this point, the other components work.
Attempting to use <v-icon>home</v-icon> shows a large “home” in text instead of the icon

Versions

Vue: 2.4.4
Vuetify: 0.16.3
OS: OSx Sierra 10.12.6
Chrome, Firefox (including nightly), Safari

What is expected ?

I expect to see icons.

What is actually happening ?

I see the text instead. “home” instead of an icon of a home

Reproduction Link

I can’t reproduce from the given fiddle.

Issue Analytics

State:
Created 6 years ago
Reactions:8
Comments:27 (7 by maintainers)

Top GitHub Comments

191reactions

bakossandorcommented, Oct 8, 2018

with Vue CLI 3 we has no index.html in the src folder so alternatively you can npm install --save material-design-icons-iconfont and import it in the main.js file import 'material-design-icons-iconfont/dist/material-design-icons.css'

125reactions

Mbarsilacommented, May 7, 2018

Including link href=‘https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Material+Icons’ rel=“stylesheet” type=“text/css”

in my index file solved my problem