javascript - 单个JavaScript文件的TypeScript定义

我正在尝试在Ionic2 HTML5视图中运行Movilizer应用。为了在Movilizer容器客户端和Ionic2应用之间发送数据，我需要包含一个plugins/Movilizer.js文件。据我了解，Movilizer系统将使用包含实际实现的文件替换该文件。该文件的内容如下：

//File at: src/plugins/Movilizer.js
var Movilizer = function() {};

Movilizer.prototype.readGlobalVariable = function(varName, successCB, errorCB)
{
    result = "Hello World";
    successCB(result);
}

var movilizer = new Movilizer();

为了能够在TypeScript文件中使用Movilizer接口，我相信我需要制作一个Movilizer.d.ts定义文件。但是，我对此有麻烦。我尝试了以下方法：

//File at: src/plugins/Movilizer/index.d.ts
//Also tried it at: src/plugins/Movilizer.d.ts
export = Movilizer;

declare class Movilizer {
    constructor();

    readGlobalVariable(key: string, onSuccess: (value: string) => void, onError: () => void): void;
}

我也尝试在我的.d.ts文件中引用tsconfig.json文件。添加此内容并没有改变：

//File at: tsconfig.json
(...)
"files": [
    "src/plugins/Movilizer/index.d.ts"
],
(...)

我尝试如下使用FooPage中的文件。这样可以编译：

//File at: src/pages/foo/foo.ts
import {Component} from '@angular/core';
import {NavController} from 'ionic-angular';
import Movilizer from '../../plugins/Movilizer';

@Component({
    selector: 'page-foo',
    templateUrl: 'foo.html'
})
export class FooPage {

    constructor(public navCtrl: NavController) {
        new Movilizer().readGlobalVariable("myGlobalVariable", (result) => {
            console.log('readGlobalVariable Success: ' + result);
        }, () => {
            console.log('readGlobalVariable Failure!');
        });
    }

}

我正在像这样测试应用程序：

$ ionic serve

这立即崩溃，并显示以下错误消息：

EXCEPTION: Error in ./FooPage class FooPage_Host - inline template:0:0 caused by: __WEBPACK_IMPORTED_MODULE_2__plugins_Movilizer___default.a is not a constructor
ErrorHandler.prototype.handleError
_callAndReportToErrorHandler/<
sg</d</t.prototype.invoke
NgZone.prototype.forkInnerZoneWithAngularBehavior/this.inner<.onInvoke
sg</d</t.prototype.invoke
sg</v</e.prototype.run
h/<
sg</d</t.prototype.invokeTask
NgZone.prototype.forkInnerZoneWithAngularBehavior/this.inner<.onInvokeTask
sg</d</t.prototype.invokeTask
sg</v</e.prototype.runTask
i
mh/</u
mh/<
Vl/r

我的问题
如何在TypeScript文件中使用Movilizer.js文件？如果我需要一个.d.ts文件，如何创建它？

最佳答案

我注意到export的代码中没有Movilizer.js。因此，它不是一个模块。然后，您不能import。

您可以在浏览器中加载它，而不是将其加载为模块，而是将其加载为脚本（例如，不是在Webpack中，而是使用标记<script>）。然后它将作为全局变量存在。在TypeScript中，我们可以期望文件Movilizer/index.d.ts声明了全局变量。因此，您可以使用它。

有关：


Here are the differences在modules和scripts之间；
也许可以将Movilizer.js附加到Webpack捆绑包中，并添加诸如expose loader之类的内容？

关于javascript - 单个JavaScript文件的TypeScript定义，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/40886232/