How to import PhotoSwipe with Rails and Importmap

173 views Asked by At

I've pinned photoswipe:

./bin/importmap pin photoswipe --download

in app/javascript/application.js I've added

import PhotoSwipeLightbox from 'photoswipe'
document.addEventListener("turbo:load", function() {
  const lightbox = new PhotoSwipeLightbox({
    gallery: '#existing-files',
    children: '.gal',
    pswpModule: () => import('photoswipe')
  });
  lightbox.init();
});

The lightbox opens straight away on page load but the image is missing. pswpModule: () => import('photoswipe') doesn't appear to work but no error is given.

1

There are 1 answers

0
Mark Robinson On

I worked it out. I needed:

./bin/importmap pin photoswipe --download
./bin/importmap pin photoswipe/lightbox --download

then

import PhotoSwipeLightbox from 'photoswipe/lightbox'