CODEWITHSUNDEEP
angulartwitter-bootstrapintellisensevisual-studio-2019font-awesome-4
Sam
Sam

Reputation: 5677

Is there a way to get Intellisense for Bootstrap and FontAwsome in Angular project opened as a folder in Visual Studio 2019

I am working on an Angular Project in Visual Studio 2019 I've opened as a folder. Everything is working very nicely. Intellisense for TypeScript/JavaScript classes and Angular. And when you roll over a method you get the description and return value and so forth. Is there a way to get the intellisense working for BootStrap and Font Awsome? I know in a .Net Cor project you have to do something with a _view[something] file. Can't remember. I've been out on disablitily for a year and just starting to get back to studying. Figured I'd use the time to finally just sit down here and learn Angular once and for all.

Upvotes: 3

Views: 3630

Answers (3)

Mahdi Abyaznezhad
Mahdi Abyaznezhad

Reputation: 522

If you include just the bootstrap folder which is located in “\ClientApp\node_modules” folder, bootstrap’s IntelliSense works fine in your ( *.html and *.css ) files in your visual studio 2019 .Net Core with an angular project. In order to do that :

  1. click “Show All Files” in Solution Explorer Here
  2. Right now, you can see the node_modules folder with a light gray color.
  3. Open that folder and right-click on bootstrap folder and click on Include In Project
  4. Then close and open your project again with visual studio here

It works for me in Visual Studio 2019, .NET Core5, Angular 11.

Upvotes: 3

David Brunning
David Brunning

Reputation: 641

I had the same problem, and I noticed that styles.css also wasn't included in Intellisense.

Instead of working in a folder, I had to:

  1. Create a new blank solution (Create a new project > Search for "Blank Solution")
  2. Right click the solution and click "Add > Existing Web Site...".
  3. Browse to the folder containing the Angular folder and click "Open"

IntelliSense builds straight away in the component HTML now.

IntelliSense from Bootstrap classes

I have read that including node_modules in the project makes searching really slow, but if I exclude node_modules by making it a hidden folder, IntelliSense stops working for bootstrap CSS files again. Styles.css continues to show up, though.

Oh, also I updated Visual Studio to 16.4.5.

Upvotes: 4

LoLance
LoLance

Reputation: 28216

For me, l install the latest npm version and create a angular project by ng new xxx(project name) and then install bootstap(cd your project folder and then use command npm install bootstrap) and font-awesome(npm install awesome) into my project.

Besides, open the bootstrap and font-awesome as folder in VS2019(community version16.3.7) and Intelliense works well as the below pictues shows:

Bootstrap

enter image description here

enter image description here

Font-awesome

enter image description here

enter image description here

So l guess the issue is more related to your VS settings,environment or the steps you take to create the angular project.

Suggestions

Note: Please check whether you have installed the workload Node.js development and ASP.NET and web development.

1.reset your VS settings(Tools-->Import and Export Settings...-->Reset all settings) to make sure the Settings do not interfere with the use of intellisense.

2.start VS2019 with devenv /safemode in case they interfere with intellisense.

3.create a angular core web application in VS2019 to check whether intelliense works well. If it works well, maybe the issue is something wrong from your initial angular project. And it not, maybe Intelliense components are broken.

>>Try to do a repair in VS Installer

In addition, if neither NPM nor VS2019 is the latest version， please update it.

Upvotes: 1

Related Questions