nuxt
nuxt copied to clipboard
Iconfont Configuration Doesn't Reflect the Icon on Nuxt
Versions and Environment
Vuetify: 1.2.6 Vue: 2.5.17 Browsers: 70.0.3538.67 (Official Build) (64-bit) OS: Fedora 28
Previously worked in:
Vuetify: Vue:
Steps to reproduce
Add iconfont configuration as nuxt plugin.
Expected Behavior
Iconfont configuration reflects the icon.
Actual Behavior
Iconfont configuration doesn't reflect the icon.
Reproduction Link
https://codesandbox.io/s/github/jefrydco/vuetify-mdi-icon
Additional Comments:
@jefrydco to fix thi atleast for now you need to install a dependency " material-design-icons-iconfont " and import it to the plugins it will works
working demo https://codesandbox.io/s/lxqjmo7l1l
@Codefa Take a look this https://github.com/vuetifyjs/vuetify/blob/dev/src/components/Vuetify/mixins/icons.js, I thought the mdi
value for iconfont should be fine if I just add the @mdi/font
packages.
And the material-design-icons-iconfont
dependency actually the default icon used in vuetify. On this repo that package is loaded manually through the head section.
@jefrydco another way is use the mdi-iconName inside the v-icon tag without adding material-design-icons-iconfont don't know why this works as per the docs in the official site
<v-icon>mdi-menu</v-icon>
@Codefa Yup, actually including @mdi/font
package will be worked by adding prefix to icon name, but one thing I consider is, the default icon used by vuetify like hamburger menu doesnt change into mdi-prefixed after I configure iconfont to mdi.