角度為 6 的 CamanJs

Question

我正在嘗試將 camanjs 與 angular 6 一起使用。如何添加 js lib 並在 npm 上沒有類型時將其與 angular 一起使用。 我按照很多步驟

• 使用 npm 安裝 caman

• 使用其在節點模塊中的路徑將其作為腳本添加到 angular.json

• 將它導入到組件中

import * as Caman from 'path to caman in node module'

• 在 AfterViewInit 我像這樣使用它

 ngAfterViewInit() { Caman('#image-id', function () { this.brightness(10); this.contrast(20); }); }

但是當啟動服務器時我收到這個錯誤

代碼鏈接： https : //stackblitz.com/edit/angular-d5g941

Answer 1

在.angular-cli.json的scripts數組中，添加caman的路徑

"scripts": [
    "../node_modules/path-to-caman"
],

在angular.json的scripts數組中的 Angular 6 的情況下，將路徑添加到caman

"scripts": [
    "node_modules/path-to-caman"
],

然后，在你的組件中，像這樣聲明一個名為Caman的變量：

declare var Caman: any;

你不需要做

import * as Caman from 'path-to-caman'

因為你的編譯器會拋出一個錯誤，指出：

找不到模塊“卡門”。

只需將腳本添加到.angular-cli / angular.json的腳本數組（在 Angular 6 的情況下）就會將其添加到全局范圍，您將能夠從您的組件訪問它。

此外，請確保在ngAfterViewInit生命周期鈎子方法中調用任何函數，因為它嘗試通過 id 訪問 DOM 元素。

Answer 2

• 首先做我如何將foxTooltip與Angular一起使用？

• 然后將caman文件夾下nodemodules_中的Caman.pack.js添加到assets中

• 確保您在組件開頭聲明的 var 與包“Caman”中的名稱相同，區分大小寫