如何获取TypeScript以加载Cordova插件随附的类型

时间:2018-08-20 12:27:15

标签: typescript cordova cordova-plugins typescript-typings

我在用TypeScript(cordova-plugin-camera)编写的基于Cordova的应用程序中使用了3.0.1,我希望能够看到该插件的类型。

因此,我使用npm安装软件包@types/cordova-plugin-camera。在安装过程中,npm显示WARN deprecated不需要解释此@types软件包,因为键入已经包含在软件包cordova-plugin-camera中。因此,我再次取出包装。

然后我开始编译,但是编译失败,并显示error TS2339: Property 'camera' does not exist on type 'Navigator'。我的理解是,这应该是开箱即用的(至少对于@types包来说),但是TypeScript似乎不知道它应该直接包含cordova-plugin-camera的类型。这似乎是合乎逻辑的,因为我没有明确的声明将其告知import 'cordova-plugin-camera',但是没有必要,因为我只使用由cordova加载的全局可用对象。

如何让TypeScript直接从cordova-plugin-camera加载类型?


我已经尝试过的可能解决方案


import 'cordova-plugin-camera'

在我的情况下不起作用,因为我从事的项目相当老,并且不支持模块。它只是使用outFile"module": "none"生成一个文件。


⚠️在types中使用tsconfig.json属性

添加

"types": [ 
  "cordova-plugin-camera" 
]

tsconfig.json适用于cordova-plugin-camera,但导致TypeScript停止加载所有其他包的类型,因此我必须将每个带有类型的包添加到我的tsconfig.json。 / p>


⚠️在typeRoots中使用tsconfig.json属性

添加

"typeRoots": [
  "./node_modules/@types",
  "./node_modules/cordova-plugin-camera"
]

tsconfig.json适用于cordova-plugin-camera和其他软件包,但是在cordova-plugin-camera中不包含类型的每个文件夹的构建过程中会导致选项错误:

error TS2688: Cannot find type definition file for '.github'.
error TS2688: Cannot find type definition file for 'appium-tests'.
error TS2688: Cannot find type definition file for 'doc'.
error TS2688: Cannot find type definition file for 'jsdoc2md'.
error TS2688: Cannot find type definition file for 'src'.
error TS2688: Cannot find type definition file for 'tests'.
error TS2688: Cannot find type definition file for 'www'.

使用./node_modules/cordova-plugin-camera/types而不是./node_modules/cordova-plugin-camera导致TypeScript找不到类型,而使用./node_modules会导致每个没有类型的包的选项错误。


✅使用/// <reference types="cordova-plugin-camera" />

/// <reference types="cordova-plugin-camera" />添加到我的TypeScript文件之一适用于cordova-plugin-camera和所有其他软件包,而不会引起错误。但是,对任何一个TypeScript文件(只要是包含在构建中的文件都无关紧要)添加引用对我来说似乎不合适。


我还没有尝试过其他方法吗? 解决这个问题的正确方法是什么?

2 个答案:

答案 0 :(得分:4)

我相信/// <reference types="cordova-plugin-camera" />是正确的方法。对于不使用模块的项目,您可以将其视为import 'cordova-plugin-camera'的类似物。无论哪种情况,您都必须随意选择一个文件来保存指令(或者,如果愿意,可以将其放入多个文件中;这没有什么区别。)

开箱即用,only @types packages are automatically included,因此,如果您使用提供全局声明的非@types包,我想您应该使用/// <reference types="..."/>或{{1} }。

答案 1 :(得分:0)

我的项目在 Angular 中,并使用 Cordova 为设备打包。我必须在两个项目中导入库,Angular 和 Cordova。我没有找到好的和干净的选项,所以我放弃打字并使用“声明”:

declare var Camera: any
declare var navigator: any

export const getPicture = () => new Promise((resolve, reject) => {
    const options = {
        quality: 50,
        destinationType: Camera.DestinationType.DATA_URL
    }
    navigator.camera.getPicture(resolve, reject, options)
})

它就像一个魅力。