JSPM + TypeScript + PhotoSwipe：ライブラリを正常にインポートして使用するにはどうすればいいですか？

Question

JSPMとTypeScriptプロジェクトでPhotoSwipeライブラリを使用しようとしましたが、成功しませんでした（私はここで出血しています）。 DefinitelyTypedからPhotoSwipeための修正版定義ファイルを使用して

（元は動作しませんでした - 「PhotoSwipe定義されていません」てしまった）、私はこの思い付いた：それをインポートしようと

declare var PhotoSwipe: PhotoSwipe.IPhotoSwipeStatic; 
declare var PhotoSwipeUI_Default: PhotoSwipeUI_Default.IPhotoSwipeUI_DefaultStatic; 

declare module PhotoSwipe { 
    ... 
    interface IPhotoSwipeStatic { 

     new <T extends Options> (pswpElement: HTMLElement, 
      uiConstructor: (new (pswp: PhotoSwipeInstance<T>, framework: UIFramework) => UI<T>) | boolean, 
      items: PhotoSwipe.Item[], 
      options: T): PhotoSwipeInstance<T>; 
    } 
} 

declare class PhotoSwipeInstance<T extends PhotoSwipe.Options> { 
    ... 
} 


declare module PhotoSwipeUI_Default { 
    ... 
    interface IPhotoSwipeUI_DefaultStatic { 

     new (pswp: PhotoSwipeInstance<Options>, framework: PhotoSwipe.UIFramework): PhotoSwipeUI_DefaultInstance; 
    } 
} 

declare class PhotoSwipeUI_DefaultInstance implements PhotoSwipe.UI<PhotoSwipeUI_Default.Options> { 
    ... 
} 

、私は

const photoSwipe = new PhotoSwipe(pswpElement, PhotoSwipe.PhotoSwipeUI, items, options);

1）

declare module "photoswipe" { 
    export = { PhotoSwipe, PhotoSwipeUI_Default }; 
} 

：でPhotoSwipeのインスタンスを作成する方法を見つけ出すように見えることはできません

とimport "photoswipe"; =>私はにReferenceErrorを得る：PhotoSwipeが

2）

declare module "photoswipe" { 

    export var PhotoSwipe: PhotoSwipe.IPhotoSwipeStatic; 
    export var PhotoSwipeUI_Default: PhotoSwipeUI_Default.IPhotoSwipeUI_DefaultStatic; 
} 

とimport { PhotoSwipe, PhotoSwipeUI_Default } from "photoswipe"; 定義されていません=>私はTypeError例外を取得：photoswipe_1.PhotoSwipeはコンストラクタ

ではありません

Anyone ?

Answer 1

私はそれが遅れているかもしれないと知っていますが、解決策はここにあります：

require([ 
     'path/to/photoswipe.js', 
     'path/to/photoswipe-ui-default.js' 
    ], function(PhotoSwipe, PhotoSwipeUI_Default) { 

    //  var gallery = new PhotoSwipe(someElement, PhotoSwipeUI_Default ... 
    //  gallery.init() 
    //  ... 

}); 

ソース - 前http://photoswipe.com/documentation/getting-started.html

はまた、いくつかのファイルにインポートすることを忘れないでください：私はグローバル型と活字体経由でそれをやろうとしていると、単純なことをして

import 'photoswipe/dist/photoswipe.css'; 
import 'photoswipe/dist/default-skin/default-skin.css'; 

：

import { PhotoSwipe, PhotoSwipeUI_Default } from 'photoswipe'; 

しかし、動作しませんでした。私はあなたと同じエラーを抱えていた。

幸運を祈る！

PS - そして、私はwebpackでテストしましたが、JSPMではテストしませんでした。

Answer 2

npm install photoswipe 
npm install --save @types/photoswipe 

install photoswipeとnpmからのタイプの定義です。

import photoSwipe from 'photoswipe' 

上記のインポート文を使用して使用できます。

これが役に立ちます。