This library generates Vue 3 components for Google's Material Design icons library. https://github.com/google/material-design-icons
-
Install the package.
npm i @libshaun/mdi-vue
-
Import an icon component.
- Option 1:
import Map from '@libshaun/mdi-vue/Map';
- Option 2:
import { Map } from '@libshaun/mdi-vue';
Option 1 is safer to use, but Option 2 is a bit cleaner. Make sure you utilize tree shaking if using the second approach or you will end up with a multi-MB bundle.
-
Then use it somewhere. e.g.
<template> <button> <Map /> Map </button> </template> <script> import { Map } from '@libshaun/mdi-vue'; import { defineComponent } from 'vue' export default defineComponent({ components: { Map, }, }) </script>
-
Fork and/or clone this repo.
-
Install dependencies.
npm install
-
Run the generator script.
npm run generate
Simply push a new tag and the GitHub Action will generate the components and release on NPM.