如何在angular中導入外部javascript庫？

Question

我正在嘗試導入諸如popper，jquery和chart.js之類的庫以在有角度的項目中使用。

我使用cli下載了它們，並在我的index.html和angular.json文件中引用了它們。

index.html

<head>
...
<script src="node_modules/chart.js/dist/Chart.js"></script>
</head>

angular.json

...
"styles": [
              "node_modules/bootstrap/dist/css/bootstrap.css",
              "node_modules/font-awesome/css/font-awesome.css",
              "src/styles.css"
            ],
            "scripts": [
              "node_modules/chart.js/dist/Chart.js"
            ]
...

出現的錯誤信息是

The resource from “http://localhost:4200/node_modules/chart.js/dist/Chart.js” was blocked due to MIME type (“text/html”) mismatch (X-Content-Type-Options: nosniff)

Answer 1

以Chart.js為例：

npm install --save chart.js
npm install --save-dev @types/chart.js

然后在您的組件中：

import * as Chart from 'chart.js'

...

const chart = new Chart(...)

無需觸摸index.html或將任何內容放入您的angular.json腳本中。

如何在angular中導入外部javascript庫？

問題描述

1 個解決方案

解決方案1
0 已采納 2019-09-06 16:23:49

如何在angular中導入外部javascript庫？

問題描述

1 個解決方案

解決方案1 0 已采納 2019-09-06 16:23:49

解決方案1
0 已采納 2019-09-06 16:23:49