在Angular2中添加外部庫

我從Angular2開始我的冒險，我已經閱讀了很多教程，但有一件事是我關心的。假設我們有兩個視圖 - 一個視圖和一個上傳圖像。

首先查看將通過以下方式處理 - 讓我們說「ReportComponent」和HTML模板它會用「chart.js之」庫
第二種觀點將「UploadMediaComponent」處理和HTML模板它將使用'Dropzone.js'

如何在html上包含這個JavaScript庫？在大多數教程中，我已經閱讀了解決這個問題的唯一方法是在index.html頁面中包含兩個庫（這與單頁面應用程序模式一致）。但另一方面 - 我們是否真的需要一次加載數百個外部庫，即使我們只需要在一個視圖（單個組件）中使用它，也需要加載應用程序？假設我只需要在一個視圖上使用'Dropzone.js'，是否需要在客戶端的每個html視圖上加載它？在Angular2中添加外部庫

來源

2016-11-28 Cichy

我希望這將幫助你：https://medium.com/@s_eschweiler/using -external-libraries-with-angular-2-87e06db8e5d1＃.pnt05l1nw –

Dropzone in angular2：http://126kr.com/article/5q2i93rmste –

您可以在angular-cli.json配置文件中添加文件。

例子：

"assets": [ 
    "path/Dropzone.js" , 
    "path/Chart.js" 
    ],

然後直接包含文件ReportComponent

<script src="/Chart.js"></script>

和UploadMediaComponent

<script src="/Dropzone.js"></script>

來源

2016-11-28 11:14:07

您是否嘗試過使用bower或npm？在你設置它並安裝你需要的庫之後，它會自動將它們添加到你的html庫中。

來源

2016-11-28 11:22:16 Fedeco

您可以在您的angular-cli.json配置文件中添加文件。

例子：

"scripts": [ 
    "../node_modules/jquery/dist/jquery.js", 
    "../node_modules/tether/dist/js/tether.js", 
    "../node_modules/bootstrap/dist/js/bootstrap.js", 
    "../node_modules/highcharts/highcharts.js", 
    "../node_modules/chart.js/dist/Chart.js", 
    "../node_modules/chart.js/dist/Chart.min.js"  

    ]

直接添加所有的JS構建將生成腳本捆綁版本，不再需要進口

來源

2017-03-08 09:36:16

在Angular2中添加外部庫

回答

相關問題