Skip to content

This library generates Vue 3 components for Google's Material Design icons library.

License

Notifications You must be signed in to change notification settings

simshaun/mdi-vue

Repository files navigation

Material Design Icons

npm

This library generates Vue 3 components for Google's Material Design icons library. https://github.com/google/material-design-icons

Usage

  1. Install the package.

    npm i @libshaun/mdi-vue
  2. 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.

  3. 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>

How to generate icons

  1. Fork and/or clone this repo.

  2. Install dependencies.

    npm install
  3. Run the generator script.

    npm run generate

Maintenance

Simply push a new tag and the GitHub Action will generate the components and release on NPM.

About

This library generates Vue 3 components for Google's Material Design icons library.

Topics

Resources

License

Stars

Watchers

Forks

Packages

No packages published