Angular : 如何从 Bower 加载外部库（在 NPM 中不可用）

Question

我想使用从 bower repo 获得的库。

因为 它在 NPM 中不可用，我想知道它如何让它工作并在我的应用程序中配置它，我的结构看起来像这样：

我尝试通过键入

来像处理任何其他库一样处理它

import * as DX from 'bower_components/xtrareportsjs';

并且我尝试将其作为脚本添加到 index.html 或 angular-cli.json 脚本部分：

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

但在所有这些情况下都无法识别它。

NB : 我想重新利用我的文件（就像jQuery）而不只是执行它

我发现了旧的解释，关于 system.JS 下的进口，但如您所见，这不是我的情况。

建议??

Answer 1

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

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

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 中不可用）

Angular : How to load external library from Bower (not available in NPM)

typescript

bower

webpack

angular-cli

angular