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.

注意:我想重新利用我的文件(像 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 文件 然后导入路径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屋！