TypeScript - ウィンドウにモジュール/ネームスペースを添付する

Question

私はES2015を使って多くのAPIとアプリケーションを構築しましたが、まだTypeScriptのベストプラクティスには慣れていないので、助けてください。 私はショップのAPI/SDKを構築しています。目標は、ユーザが私のjsファイルを含み、ウィンドウオブジェクトを介してショップとそのネームスペースにアクセスすることです。角度やその他のライブラリでも同様です。 ECMAScriptの2015年に

window.shop.init(); 
window.shop.cart.get(); 
window.shop.cart.set(); 
window.shop.cart.clear(); 

、私は、getとsetのように私の方法を書き、私のメインのファイルにそれらをインポートし、お店オブジェクト、最後にグローバルオブジェクトを拡張します。 ES2015に名前空間をのための良い方法なので

// in my cart.js namespace file 
export {get} from './get'; 

// in my shop.js 
import * as cart from './cart'; 

global.shop = { 
    cart 
} 

、それはすべてのそれらのモジュールと名前空間キーワードを持つ活字体でちょっと間違っている感じています。

私は基本的にTSで同じことをしたいです。私は次のようなことを試みましたが、成功しませんでした。

module shop { 
    export const cart = {...} 
} 

(<any>window).shop = shop; 

または

いくつかのチュートリアルは、モジュールが自動的にグローバル/ windowオブジェクトに添付されていることを主張し、それが私のために実現しなかったがあり

namespace shop { 
    // ... 
} 

(<any>window).shop = shop; 

。

私はTypeScript 1.8.10を使用しています。どんな助けでも大歓迎です！

Answer 1

モジュールが自動的にグローバル/ウィンドウオブジェクトにアタッチされているが、それは私には起こらないと主張するチュートリアルがあります。たぶん

あなたnamespaceのコードは、（ES6）モジュール代わりのスクリプト中にあるため？ differences between scripts and modules are detailed here。それはタグ<script src="shop.js">（またはあなたがuglifyjsと、たとえば、他のJavaScriptファイルで、このファイルを連結することができます）とスクリプト、すなわちとしてロードされている場合

は

コードは、以下のブラウザでグローバル変数shopになります。

// File shop.ts 
namespace shop { 
    export const cart = { /* ... */ } 
} 

あなたのコードは（のWebPACK、SystemJS、RequireJSまたは他の助けを借りてIE）ES6モジュールとしてロードされている場合は、あなたのソリューションが有効である：

(<any>window).shop = shop; 

Answer 2

答え@paleoによっては、完璧ではありません。 ショップの型推論を抑制するだけです。

私は今朝も同様の問題に遭遇します。私はSO上で非常に多くの "ソリューション"を試しましたが、それらのどれも絶対にタイプエラーを生成せず、IDE（ウェブストームまたはvscode）でトリガタイプのジャンプを可能にしていません。

最後に、ここで

https://github.com/Microsoft/TypeScript/issues/3180#issuecomment-102523512

から、私はに合理的な解決策を見つけるには、インタフェース/クラスとして機能し、両方を名前空間のグローバル変数のためのタイピングを添付してください。

例は以下である：

// typings.d.ts 
declare interface Window { 
    shop?: MyNamespace & typeof MyNamespace 
} 

declare interface MyNamespace { 
    somemethod?() 
} 

declare namespace MyNamespace { 
    // ... 
} 

次に、上記のコードは、グローバル変数shop（ウィンドウのプロパティ）に名前空間MyNamespaceとインターフェースMyNamespaceのタイピングをマージします。