Getting Started with Vue.js

Vue Icon Component

MDI can be used in conjunction with the Vue Icon Component. See the README in the repo for more usage information.

Basic Usage

  1. Install from NPM.

    npm install @mdi/js @jamescoyle/vue-icon
  2. Import into your project.

    import SvgIcon from '@jamescoyle/vue-icon' import { mdiAccount } from '@mdi/js'

SFC Example

The following example shows how you might use an icon within a single file component.

<template> <svg-icon type="mdi" :path="path"></svg-icon> </template> <script> import SvgIcon from '@jamescoyle/vue-icon'; import { mdiAccount } from '@mdi/js'; export default { name: "my-cool-component", components: { SvgIcon }, data() { return { path: mdiAccount, } } } </script>