title: VueJS and FontAwesome Import - Module not found: Error: Can't resolve '@fortawesome/fontawesome-svg-core'
body: <p><code>Module not found: Error: Can't resolve '@fortawesome/fontawesome-svg-core' in '/project/src/plugins'</code></p>
  
  <p>Been trying to follow up this tutorial (<a href="https://blog.logrocket.com/full-guide-to-using-font-awesome-icons-in-vue-js-apps-5574c74d9b2d/" rel="noreferrer">https://blog.logrocket.com/full-guide-to-using-font-awesome-icons-in-vue-js-apps-5574c74d9b2d/</a>) to upgrade my current fontawesome (4.0.7) to the newest 5.0.12 version on my project, but keep getting this error, that is pretty clear that the project is not finding the lib.</p>
  
  <p>I used</p>
  
  <pre><code>npm install --save @fortawesome/fontawesome-svg-core 
  npm install --save @fortawesome/free-solid-svg-icons 
  npm install --save @fortawesome/vue-fontawesome
  </code></pre>
  
  <p>src/plugins/font-awesome.js</p>
  
  <pre><code>import Vue from 'vue'
  
  import { library } from '@fortawesome/fontawesome-svg-core'
  import { faCoffee } from '@fortawesome/free-solid-svg-icons'
  import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
  
  library.add(faCoffee)
  
  Vue.component('font-awesome-icon', FontAwesomeIcon)
  </code></pre>
  
  <p>main.js</p>
  
  <pre><code>/* ============
   * Main File
   * ============
   *
   * Will initialize the application.
   */
  
  import Vue from 'vue';
  
  /* ============
   * Plugins
   * ============
   *
   * Import and bootstrap the plugins.
   */
  
  import './plugins/vuex';
  import './plugins/axios';
  import { i18n } from './plugins/vue-i18n';
  import { router } from './plugins/vue-router';
  import './plugins/vuex-router-sync';
  import './plugins/bootstrap';
  import './plugins/font-awesome';
  import './plugins/moment';
  import './plugins/vuelidate';
  import './plugins/scrollto';
  import './plugins/filters';
  import './plugins/casl';
  
  // Theme css imports
  import './assets/css/application.scss';
  
  
  /* ============
   * Main App
   * ============
   *
   * Last but not least, we import the main application.
   */
  
  import App from './App.vue';
  import store from './store';
  
  Vue.config.productionTip = false;
  
  store.dispatch('auth/check');
  
  /* eslint-disable no-new */
  new Vue({
    /**
     * Bind the Vue instance to the HTML.
     */
    el: '#app',
  
    /**
     * The localization plugin.
     */
    i18n,
  
    /**
     * The router.
     */
    router,
  
    /**
     * The Vuex store.
     */
    store,
  
    /**
     * Will render the application.
     *
     * @param {Function} h Will create an element.
     */
    render: h =&gt; h(App),
  });
  </code></pre>
  
  <p>Other plugins are working fine, and the folder actually exists on node_modules.
  Any other approach I should try to solve this?</p>