Best practice for adding non-angular2 library

[rennen]

Team,

What's the best practice on adding a non angular2 JS library that resides in CDN? Also, what's the best practice to use google fonts?

Thanks!

[Foxandxss]

You can use both in script tags or personally I would prefer if the library could be npm installed and loaded in vendor.ts

[rennen]

Thanks for the quick answer. So if this is not npm-installable, best practice is to simply add this in index.html then?

[Foxandxss]

It is weird to not have a library not npm-installable. You can raise a bug for that.

You can use cdn or perhaps add a folder with third party vendors and put them there and load them into vendor.ts.

It is all about your projects and your conventions, you just need to be consistent.

[un33k]

Font Awesome comes with font files as well. So, dropping the font awesome css into vendor.js doesn't copy over the font files. Any native solution for this or one must fiddle with webpack's config file?

[rennen]

Thanks

[Avareto]

I tried to add jquery as an external, non angular2 lib. I added

npm install jquery import "jquery" appended to vendor.ts typings install dt~jquery --global

When running the app it throws EXCEPTION: ReferenceError: $ is not defined when I try to use $ in the app.component's constructor. Any idea what went wrong?

[artemzi]

@Foxandxss can you please provide simple example? I was update my project to rc.5 and have some imports in vendor.ts (for bootstrap 4.0.0-alpha.3)

import 'jquery/dist/jquery.js'; import 'tether/dist/js/tether.js'; import 'bootstrap/dist/js/bootstrap.js';,

but get error ' Bootstrap's JavaScript requires jQuery', all npm's was installed, also how i must use lib's like bootstrap-datepicker and others third part? I don't understand all this stuff with *.d.ts files, where to put it and how to use... Google search for this topic just create more questions and don't give any answers...

[Foxandxss]

Everything is a bit more complicated when you put jQuery into the game. I never ever used it in any latest project, but I do remember having to modify the webpack 2 configuration to preload jQuery or similar. Will ask to this friend where we did that.

[artemzi]

@Foxandxss ok thanks, looks like for simple date picker create it from scratch will be much easy than using from jquery of bootstrap.

[Foxandxss]

I think we solved this issue, right? I will make third party inclusion easier in the near future.