2016-11-30 4 views
1

Ionic2アプリをMovilizer HTML5ビュー内で実行しようとしています。 MovilizerコンテナクライアントとIonic2アプリの間でデータを送信するには、plugins/Movilizer.jsファイルを含める必要があります。私が理解しているように、Movilizerシステムはそのファイルを実際の実装を含むものに置き換えます。次のようにファイルの内容は以下のとおりです。私の活字体ファイルにMovilizerインタフェースを使用することができるようにするために単一のJavaScriptファイルのタイプスクリプトの定義

//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(); 

が、私は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; 
} 

私はまた私のtsconfig.jsonファイルに.d.tsファイルを参照しようとしています。これを変更すると、何も変更されませんでした。

//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!'); 
     }); 
    } 

} 

を私はこのようなアプリをテストしています:

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 

私の質問
方法:これはすぐに次のエラーメッセージでクラッシュし

$ ionic serve 

をこれがコンパイルありませんTypeScriptファイルでMovilizer.jsファイルを使用しますか? .d.tsファイルが必要な場合、どうすれば作成できますか?

答えて

1

Movilizer.jsのコードにはexportがありません。したがって、それはモジュールではありません。その後、importすることはできません。

あなたがいない(例えば、ないWebPACKのではなく、マークアップ<script>付き)モジュールとしてではなくスクリプトとして、ブラウザでそれを読み込むことができます。その後、グローバル変数として存在します。 TypeScriptでは、ファイルMovilizer/index.d.tsがグローバル変数を宣言することが期待できます。したがって、あなたはそれを使うことができます。

関連:modulesscripts

+0

@ABoschman Webpackのどのバージョンですか? – Paleo

+0

@ABoschman: 'Movilizer.js'のコードでは、' export'が見つかりません。このファイルのどこかに 'export'がありますか? – Paleo

+1

@ABoschman: 'Movilizer'に' export'がなければ 'import'してはいけません。あなたはモジュールとしてではなく 'script'(例えば、Webpackではなくマークアップ'

関連する問題