Uncaught TypeError: Object(...) is not a function for Cordova plugin reference答案

【问题标题】：Uncaught TypeError: Object(...) is not a function for Cordova plugin referenceUncaught TypeError: Object(...) is not a function for Cordova plugin reference
【发布时间】：2019-09-26 18:12:20
【问题描述】：

我使用 plugman 创建了一个 cordova 插件，并尝试在我的 ionic 应用程序中使用它。但是我得到了 Uncaught TypeError: Object(...) is not a function... 我无法弄清楚这个错误是什么。

做了一些研究，发现升级 ionic-native 版本可能有效，但在我的情况下没有。

我正在尝试为插件创建一个包装服务，如下所示：

    import { Injectable } from '@angular/core';
    import { Plugin, Cordova, IonicNativePlugin } from '@ionic-native/core';

    @Plugin({
      pluginName: 'mathcalculator',
      plugin: 'cordova.plugin.mathcalculator',
      pluginRef: 'MathCalculator', 
      repo: 'https://github.com/dkandel/MathCalculator.git', 
      platforms: ['Android']
    })

    @Injectable({
     providedIn: 'root'
    })
    export class MathService extends IonicNativePlugin {

      @Cordova()
      add(args: any): Promise<any> {
       return;
      }
    }

该服务已添加到 App 模块文件中的提供程序中。我的插件文件夹中也有插件。当我尝试运行应用程序时，我不断收到 Object(...) is not a function 并且错误指向我的服务文件上的@Cordova()。

谁能帮帮我？

【问题讨论】：

安装插件时是否有依赖警告？
您是否使用 gulp 构建了包装器？如果没有尝试关注this教程
@Sam .. 不，我只是收到错误消息。

标签： cordova ionic-framework cordova-plugins ionic4 ionic-native

【解决方案1】：

不确定您是否仍需要该解决方案，但这对我有用。

import { Injectable } from '@angular/core';
import { cordova, IonicNativePlugin } from '@ionic-native/core';


@Injectable()
export class PluginService extends IonicNativePlugin {
  static pluginName = 'mathcalculator';
  static plugin = 'cordova-plugin-mathcalculator';
  static pluginRef = 'MathCalculator';
  static repo = 'https://github.com/GitUser/Cordova-Plugin-Example.git';
  static platforms = ['iOS']

  add(num1, num2): Promise<any> {
    const x = cordova(this, 'add', {}, [{ param1: num1, param2: num2 }])
    return x;
  }

  substract(num1, num2): Promise<any> {
    const x = cordova(this, 'substract', {}, [{ param1: num1, param2: num2 }])
    return x;
  }

}

【讨论】：

【解决方案2】：

我今天遇到了同样的问题，我犯了和你一样的错误。

问题是您直接在 Angular 服务中使用 @Plugin 和 @Cordova 装饰器，而这并不是这些装饰器的预期用途。我能找到的许多关于编写离子原生科尔多瓦插件包装器的教程都没有说明这一点。

我解决问题的方法是克隆ionic-native repo 并按照these instructions 构建插件。构建它还会创建一个 ngx 目录，其中包含另一个版本的插件，如果您希望插件使用 Observables 而不是 Promises，则应该导入该目录。

构建完成后，将其复制到项目的 node_modules/@ionic-native 目录中。然后，您可以将其添加到项目中的模块中，并将其注入服务或组件中，并像使用任何内置的本机插件一样使用它。

【讨论】：