VueJS 和 FontAwesome 导入 - 找不到模块:错误:无法解析“@fortawesome/fontawesome-svg-core”

que*_*vqz 9 font-awesome vue.js vue-cli

Module not found: Error: Can't resolve '@fortawesome/fontawesome-svg-core' in '/project/src/plugins'

一直在尝试跟进本教程 ( https://blog.logrocket.com/full-guide-to-using-font-awesome-icons-in-vue-js-apps-5574c74d9b2d/ ) 以升级我当前的 fontawesome (4.0 .7) 到我项目的最新 5.0.12 版本,但不断收到此错误,很明显该项目没有找到 lib。

我用了

npm install --save @fortawesome/fontawesome-svg-core 
npm install --save @fortawesome/free-solid-svg-icons 
npm install --save @fortawesome/vue-fontawesome
Run Code Online (Sandbox Code Playgroud)

src/plugins/font-awesome.js

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)
Run Code Online (Sandbox Code Playgroud)

主文件

/* ============
 * 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 => h(App),
});
Run Code Online (Sandbox Code Playgroud)

其他插件工作正常,该文件夹实际上存在于 node_modules 上。我应该尝试解决此问题的任何其他方法吗?

小智 7

npm i --save @fortawesome/fontawesome-svg-core
npm i --save @fortawesome/free-solid-svg-icons
Run Code Online (Sandbox Code Playgroud)

这对我有用


小智 -5

npm install --save @fortawesome/fontawesome-free