cssvue.jssassvuejs2google-material-icons

material icons not importing in vue

I have following icons npm package installed.

"material-icons": "^0.3.1"

I have imported them as following.

<style lang="sass">
$material-icons-font-path: '~material-icons/iconfont/';
@import '~material-icons/iconfont/material-icons.scss';
</style>

and I am using their classes as following.

<i class="rotate_right"></i>

But icons are not showing up. I have created vue application using vue cli 3.

Solution

  • As in document, you should use span with content is icon's name. Please try

    <span class="material-icons">rotate_right</span>