如何在 Cordova 插件中包含 npm 依赖项答案

【问题标题】：How to include npm dependencies in your Cordova plugin如何在 Cordova 插件中包含 npm 依赖项
【发布时间】：2018-09-21 00:00:06
【问题描述】：

我目前正在为 Cordova 实现一个名为 core-cordova (source code) 的插件，该插件还依赖于另一个 NPM 包。

问题是在我的应用中安装插件后使用

$ cordova plugin add @aerogearservices/core-cordova

我在控制台上有这个错误：

未找到模块@aerogearservices/core

我想我必须以某种方式将此依赖项捆绑到插件 JS 文件中，但我还没有找到方法。到目前为止，我已经尝试使用 Browserify 将所有内容捆绑到 dist/core-cordova.js 中，并在 Plugin.xml 中将其定义为：

<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

我不知道如何解决这个问题，有什么想法吗？

注意：源代码正在进行中，可能会有更改或错误。

【问题讨论】：

您将@aerogearservices/core 放置在错误的依赖项部分。就这样。你绝对不需要捆绑它。它在dependencies 下而不是devDependencies 下，因为它是使用你的包而不是开发它所需要的依赖项。
@AluanHaddad 感谢您的回复，我试过了，但没有解决，我仍然看到同样的错误。 Cordova 没有调查 node_modules，所以这不是问题。

标签： javascript cordova typescript node-modules apache-cordova

【解决方案1】：

解决了使用webpack 捆绑模块并在我的webpack 配置中将libraryTarget 设置为'window' 的空对象问题。

来自webpack docs：

libraryTarget: 'window' - 入口点的返回值将使用 output.library 值分配给窗口对象。

如果没有此设置，捆绑脚本将无法以可以从我的插件中读取的方式导出。我认为这是因为当 Cordova 加载 JS 时，它用另一个函数包装它，这防止了脚本在加载时对窗口对象的隐式分配。此外，由于我的捆绑脚本实际上并没有导出任何内容，因此 Cordova 不会从 clobbers 标记中提取任何内容来分配给窗口对象。

注意此设置，您也可以删除clobbers 标签。

【讨论】：