How to globally import Javascript library in Angul

2019-07-17 19:24发布

I'm trying to figure out how to propertly import an external library in my Angular2 projects. As you can see reading other answers about this matter, there is a bit of confusion about it, and even Angular2 documentation have no info about it. In addition, any search on Google leads to old results related to alpha or beta version of Angular2.

I'm trying to import Foundation and jQuery libraries. I need the first to use some Foundation code, and i need the second to make Foundation JS code to work (it uses jQuery) and even to uses it in my Typescript components.

As far as i know since i have to use jQuery even in my Typescript code i need to install the "typing version" of jQuery.

So i have two types to import external libraries in Angular2 projects:

First way:

I can do it following this answer. In that way i can use jQuery code in my Typescript components and it works since i import node library with SystemJS module loader and since i install typings for jQuery (typings install dt~jquery --save --global).

Second way:

I add <script src="node_modules/foundation-sites/dist/foundation.js"></script> in index.html file. I have no need to involve SystemJS and neither any typings installation.

But in this cases i need jQuery to run Foundation. Do i need to import again jQuery using the first way? I mean adding <script src="node_modules/jquery/dist/jquery.js"></script> to the index file. Anyway i'm experiencing some problems in bootstrapping Foundation framework, as you can see here

So, what's wrong with my imports?

  • Generally speaking, how to import external libraries in Angular 2.0.0 projects?

  • In my case, how to correctly import Foundation to use its building blocks and how to correctly import jQuery to make Foundation working and to make me able to write jQuery code in Typescript components?

0条回答
登录 后发表回答