Skip to content

# Installing Font Awesome

# Point Your NPM Registry To Benevity

Make sure your project's npm registry is pointed at Benevity's Artifactory

# Add vue-svg-loader To Webpack

Configure vue-svg-loader (opens new window) in webpack.

vue-svg-loader is responsible for transforming raw SVG files into Vue compatible Javascript objects. Without this webpack does not know what to do with SVGs when inserted into Vue templates.

# Get the Goods

Add Font Awesome to your project.

$ yarn add @fortawesome/fontawesome-pro

# Use the Goods

// ExampleComponent.vue ...

<script>
  import HandHoldingHeart from '@fortawesome/fontawesome-pro/svgs/regular/hand-holding-heart.svg'

  ...
</script>

Need help?

Send us a message in the #skyline-design-system Slack channel.

Have an idea to help us improve?