How to incorporate Photoswipe with Aurelia

问题

I have a really hard time of integrating Photoswipe with Aurelia. I got compile time errors and browser errors. I looked at this question and tried what was suggested there (except the change of the typings file, because I don't know what to change), but still it is not working. With the information from the other question I managed to resolve the compile time errors but I still get an error when I initialize Photoswipe:

Uncaught TypeError: photoswipe_1.default is not a constructor

aurelia.json:

{
    "name": "photoswipe",
    "main": "photoswipe",
    "path": "../node_modules/photoswipe/dist",
    "resources": [
      "photoswipe-ui-default.js"
    ]
}

package.json:

I tried it with version 4.0.8 for both the typings and photoswipe, but no change.

"@types/photoswipe": "^4.0.27",
"photoswipe": "^4.1.2",

viewmodel:

I needed to copy the photoswipe-ui-default.js to the below folder in my project root, because without 'dist' it could not be found (o_0)
I find it really strange that it cannot find it by "photoswipe/photoswipe-ui-default.js" although it is referenced as a resource in aurelia.json.

import PhotoSwipe from "photoswipe"; 
import PhotoSwipeUI_Default from "photoswipe/dist/photoswipe-ui-default.js"
[...]
let pswpElement = <HTMLElement>document.querySelectorAll('.pswp')[0];
let gallery = new PhotoSwipe( pswpElement, PhotoSwipeUI_Default, this.items, this.options);

Anyone who can help me out?

回答1:

import * as PhotoSwipe from "photoswipe"; 
import * as PhotoSwipeUI_Default from "photoswipe/photoswipe-ui-default"

来源：https://stackoverflow.com/questions/44055143/how-to-incorporate-photoswipe-with-aurelia

标签

typescript

aurelia

photoswipe