[Fixed] How do I use the bootstrap icon package in angular

Issue

I downloaded the bootstrap icon and font awesome packages. But I don’t know how to use it, I just imported the following into styles.css file : @import "~bootstrap/dist/css/bootstrap.css"; @import "~font-awesome/css/font-awesome.css";

I guess I need to add something in the angular.json file, but I’m typing the path incorrectly enter image description here

I want it to look like this:

enter image description here

But it looks like this:

enter image description here

Solution

$ npm i bootstrap-icons

And add follow line to style.css file:

@import "~bootstrap-icons/font/bootstrap-icons.css";

And use icons like that(just example):

<i class="bi bi-person-fill"></i>

You can find any icons you would like to use in follow bootstrap official docs: bootstrap icons