Angular:如何从Bower加载外部库(在NPM中不可用) [英] Angular : How to load external library from Bower (not available in NPM)

问题描述

我想使用从 bower 回购中获得的库房.

i wanna use a librairy which i got from a bower repo .

由于 它在NPM中不可用 ，所以我想知道它如何工作并在我的应用程序中对其进行配置，因此我的结构如下所示:

Since it's not available in NPM , i wanna know how may it get it work and configure it within my app , my structure looks like this :

我尝试通过输入

import * as DX from 'bower_components/xtrareportsjs';

并且我尝试将其添加为 index.html 或 angular-cli.json 脚本的一部分"中的脚本:

and i have tried to add it as a script in the index.html OR the angular-cli.json scripts' part:

<script src="bower_components/xtrareportsjs/report-designer.js"></script>

但是在所有情况下都无法识别它.

but that didn't recognoze it in all of those case.

NB :我想重新利用我的文件(类似jQuery )，而不仅仅是执行

NB : i wanna reutilize my file (like jQuery) not just excecute it

我发现了有关在system.JS下导入的旧说明，但是正如您所见，这不是我的情况.

I found old explications , about importation under system.JS but as you can see it's not my case.

建议

推荐答案

我设法使用jquery只是转到您的angular-cli.json file，然后在scripts内导入所需库的路径 请检查下面的照片:

I managed to use jquery just go to your angular-cli.json file then import path of your desired library inside the scripts Please check the photo below:

然后像这样在您的组件上使用它

And then use it on your component like this

declare var $: any;

@Component({
    selector: 'app-navigation',
    templateUrl: './navigation.component.html',
    styleUrls: ['./navigation.component.css']
})
export class NavigationComponent implements OnInit {

     constructor(){}

     ngOnInit(){
       console.log($('#myElement'));
     }
 }

这篇关于Angular:如何从Bower加载外部库(在NPM中不可用)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！