如何在 Cordova 插件中包含 npm 依賴項

Question

我目前正在為 Cordova 實現一個名為core-cordova （源代碼）的插件，它也依賴於另一個 NPM 包。

問題是在我的應用程序中安裝插件后使用

$ cordova plugin add @aerogearservices/core-cordova

我在控制台上有這個錯誤：

未找到模塊@aerogearservices/core 未找到

我想我必須以某種方式將此依賴項捆綁到插件 JS 文件中，但我還沒有找到方法。 到目前為止，我已經嘗試使用Browserify將所有內容捆綁到一個dist/core-cordova.js並在Plugin.xml dist/core-cordova.js其定義為：

<js-module src="dist/core-cordova.js" name="MetricsService">
    <clobbers target="cordova.aerogear" />
</js-module>

使用這種方法不會給我帶來任何錯誤，但是aerogear是一個空對象：

// Browser's dev console

> window.cordova.aerogear;
-> {}

> window.cordova.aerogear.MetricsService;
-> undefined

我不知道如何解決這個問題，有什么想法嗎？

注意：源代碼正在開發中，可能會有更改或錯誤。

Answer 1

使用webpack捆綁模塊解決了空對象問題，並在我的 webpack 配置中將libraryTarget設置為'window' 。

來自webpack 文檔：

libraryTarget: 'window' - 入口點的返回值將使用 output.library 值分配給 window 對象。

如果沒有此設置，捆綁腳本將無法以可以從我的插件中讀取的方式導出。 我認為這是因為當 Cordova 加載 JS 時，它用另一個函數包裝它，這防止了腳本在加載時對窗口對象的隱式分配。 此外，由於我的捆綁腳本實際上並未導出任何內容，因此 Cordova 不會從clobbers標簽中選取任何內容分配給 window 對象。

請注意，使用此設置，您也可以刪除clobbers標簽。