4

I have an Angular 2 project based on webpack 2. Bootstrap is installed as npm package and imported in the app, but Visual Studio doesn't give me intellisense when I edit html files by default.

I added (include) node_modules/bootstrap directory for my app and after restart there is intellisense for bootstrap. I don't like this because it's polluting my project, but as a workaround not bad.

Is there another way (better) to enable this?

Update for Shazia, How to include node_modules/ into project and have intellisense for Bootstrap.

I assume you have a node_modules/ directory in your web project directory where the node packages are stored. Open the solution explorer in visual studio and have your solution open which has your web project.

Click on "Show All Files" icon in Solution Explorer at right top corner.

Show All files icon

You will see all files and directories in your web project directory including node_modules directory. Right click on the bootstrap directory under node_modules/ and select "Include In Project". It will be part of your project.

Include In Project function

Once restarted VS you will have Intellisense for bootstrap.

AndrasCsanyi
  • 3,943
  • 8
  • 45
  • 77
  • You can try to install the Bootstrap through right click the project name and choose ‘Manage Nuget Package…’ and search ‘bootstrap’ under Browse tab and install it, then the intellisense should works. Or you can have a look at this similar issue: http://stackoverflow.com/questions/24296472/visual-studio-intellisense-for-bootstrap-via-cdn and add CDN references to intellisense for Javascript which under Tools-Options-Text Editor-JavaScript-IntelliSense-References and reference group set as ‘Implicit (Windows)’. – Sara Liu - MSFT Jan 23 '17 at 09:23
  • Thank you very much for your answer. If I use either one (Nuget or CDN reference) it would be a duplicate because WebPack takes care of bundling and referencing bootstrap. So, it seems I havo to go with including the node package. – AndrasCsanyi Jan 23 '17 at 17:12
  • @SayusiAndo, where to add node package reference for bootstrap intellisense (as a workaround), as I am also facing the same issue. please copy some code – shazia perween Jan 24 '17 at 04:42
  • @SayusiAndo, you can have a try with use a particular grunt or gulp file to move the bootstrap to a dist folder, take a look at this: http://stackoverflow.com/questions/26773767/purpose-of-installing-bootstrap-through-npm – Sara Liu - MSFT Jan 24 '17 at 06:46
  • 2
    @shaziaperween: please, see my question updated. It contains how I enabled intellisense for Bootstrap so far. – AndrasCsanyi Jan 24 '17 at 11:31
  • @Sara-MSFT: I saw that answer, but I does not give more advantage than the solution I have now. However, I'm new in webpack business..., so far I have used gulp tasks. Let me gain some experience and I'll update my question when I have a better solution for this. Thanks for your suggestions! – AndrasCsanyi Jan 24 '17 at 11:34
  • @SayusiAndo, Thank you for your reply. Even I am trying the same thing, but some how I am not getting "include in project" option with VS 2015 Update 3, ...... http://stackoverflow.com/questions/41843173/include-in-project-option-missing-in-visual-studio-2015-update-3 – shazia perween Jan 25 '17 at 04:23

0 Answers0