CODEWITHSUNDEEP
jqueryasp.net-mvctwitter-bootstrapangular
iAziz
iAziz

Reputation: 149

Angular + .Net Core 2.0 app: CSS and JSs imports

As I started my app, I had been looking for a beautiful multi-select menu and found this.after installing it from its npm command, I included its CSS file in Views/Shared/_Layout.cshtml. For bootstrap-select.js, the menu would not work if I import it in my component. So I imported the whole thing 

import 'bootstrap-select';

in bootbrowser.ts file and it works just perfectly.

I'm planing to use other such beautiful plugins for my app but I'm concerned about whether if that is the best practice to import and include these files when you only are going to use them in one or two components. And will my app be slow when loading all the CSSs and JSs?

And I have been wondering is there a good reason to avoid using jQuery alongside bootstrap and angular?

Upvotes: 0

Views: 55

Answers (1)

bgraham
bgraham

Reputation: 2027

I think it's generally preferable not to include jquery in your application. It's sort of mixing frameworks and I think Angular prefers you to not directly hit the DOM yourself with things like JQuery. They have a change detection system that might not be in sync with stuff JQuery plugins might be doing.

I think size is always something to consider when building your app. Hopefully you can look into lazy loading. Then these javascript and css files will only be loaded when you enter those parts of the website. This is something to consider regardless if you are using Jquery plugins or writing your own code.

I recommend you look into an Angular third party library. I've usedNgPrime a little bit. They have a nice selection of stuff including a multiselect. They are also built in Angular so including them is just including an angular component. You can use it in you Angular templates with tags:

<p-multiSelect [options]="cities" [(ngModel)]="selectedCities"></p-multiSelect>

Hope this helps!

Upvotes: 1

Related Questions