VueJS and FontAwesome Import - Module not found: Error: Can't resolve '@fortawesome/fontawesome-svg-core' VueJS and FontAwesome Import - Module not found: Error: Can't resolve '@fortawesome/fontawesome-svg-core' vue.js vue.js

VueJS and FontAwesome Import - Module not found: Error: Can't resolve '@fortawesome/fontawesome-svg-core'


i had a same problem

webpack css-loader not support (scss and .css bundling) you need sass to do

just install sass-loader and node-sass(read below note)

npm install -D sass-loader node-sass<----------------see below note before install--------------

webpack

module.exports = {  module: {    rules: [        {        test: /\.(sass|scss|css)$/,<-----------------------note placed scss /css---------        use: [          'vue-style-loader',          'css-loader',          'sass-loader'<--------------------this is you need----------------        ]      }    ]  },  // plugin omitted}

Note: People make mistake while install npm install -d sass-loader however sass-loader brings latest version of sass means you get sass-loader:11.0.0 or above so webpack 4 does not support latest sass-loader.sass loader more than version 11 above for webpack 5.

solutions

your webpack version is 4 so you just need below sass loader version 10

npm install -D node-sassnpm install -D sass-loader@^10 <-----------importent step

my webpack

const HtmlWebpackPlugin = require('html-webpack-plugin')const VueLoaderPlugin = require('vue-loader/lib/plugin')const webpack = require('webpack')module.exports = {    entry: './src/main.js',    module: {        rules: [{                test: /\.js$/,                use: 'babel-loader'            },            {                test: /\.vue$/,                use: 'vue-loader'            },            {                test: /\.(sass|scss|css)$/,                use: ['vue-style-loader', 'css-loader','sass-loader'],                          },                   ]    },    devServer: {        open: true,        hot: true    },    plugins: [        new HtmlWebpackPlugin({            template: './src/index.html',        }),        new VueLoaderPlugin(),        new webpack.HotModuleReplacementPlugin()    ],}


npm install --save @fortawesome/fontawesome-free