My Vue app consists of multiple components, but only one page or component requires Font-Awesome. I currently have it included in the head section of the index.html file. Is there a way to move it to the specific component so that it loads only when necessary?
RELOCATE THIS
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
INTO THIS
<template></template>
<link rel="stylesheet" href="../../static/css/font-awesome-4.7.0/css/font-awesome-min.css"></link>
<script>
export default {
name: 'SingleComponent',
data: function() {
return{}
}
}
</script>
<style scoped>
</style>
I attempted to download Font-Awesome and add a link tag in the component as shown above ^^^^ However, I did not encounter any errors, but the icons still do not display correctly.