How to install Font Awesome in ASP.NET Core 2.2 using Visual Studio 2019 [closed]

Question

I am struggling to find any up to date installation guide for installing Font Awesome in ASP.NET Core 2.2

I've tried a manual file import to the project folder directory, then tried the NuGet package route but nothing works because all the guides I follow make reference to steps and folders/files that don't exist in 2.2

Being new to ASP.NET Core is likely not helping the situation :(

Answer 1

Just wanted to explicitly list the steps that has been described by other answers here.

Using Visual Studio 2019 (16.3.8) with 'ASP.NET Core Web Application' project targeting .NET Core 3.0 I did the following to install Font-Awesome on the client side:

• Right-click on the project and choose 'Add > Client-Side Library...'
• In the pop-up form, choose 'cdnjs' as Provider and type 'font-awesome' in the Library input text box, press Enter
• Click 'Install'
• The package will be installed under the wwwroot/lib folder
• In your .cshtml page, add the stylesheet you need: <link rel="stylesheet" href="~/lib/font-awesome/css/all.min.css" />

Answer 2

There are many ways to accomplish this, however in my opinion the easiest way to get up and running quickly is A.

A: Get a CDN hosted version of font awesome (it's free!)

1. Head to Font Awesome - Start and generate a 'CDN powered kit' using a valid email address.
2. You will receive an email with a 'CDN embed code', which is just a script tag.
3. Copy Pasta the script tag into the scripts section of your _Layout.

Note: you will not get intellisense for all of the icons, however there isn't much to it, and I wind up visually looking up which icon I want on font-awesome's site anyways. If you find you really need the intellisense or want to work with font-awesome in a disconnected environment, see section B.

B: One time 'install'

1. Head to Font Awesome - Download and download the zip file
2. Extract the zip file to wwwroot/lib/
3. Reference the appropriate in your _Layout.

    <!-- CSS -->
    <environment include="Development">
        <script src="~/lib/fontawesome-free-5.10.1-web/css/all.css"></script>
    </environment>

    <!-- ... --->

    <!-- JS -->
    <environment include="Development">
        <script src="~/lib/fontawesome-free-5.10.1-web/js/all.js"></script>
    </environment>

Note: In this example, I placed the CSS and JS reference to Font Awesome for the development environment only, which means you should still use section A, but place the CDN version inside the 'production' section.

<environment exclude="Development">
    <script src="https://use.fontawesome.com/abcdef1234.js"></script>
</environment>

Note: abcdef1234.js is not a real file, you'll get your specific file in the email when you sign up for the CDN package

Note: The CDN version does not have a CSS file you need to add, it's wrapped up in the JS file.

Finally

If you do need more packages than what is included with the ASP.NET Core and font awesome, I would highly recommend using moving to getting your libs through a package manager like @Tony Ngo pointed out, and LibMan is as good as any to start with.

Answer 3

You can try this approach using LibMan

Then include everything into your project just like default template include bootstrap and jquery