ResponsiveImage is a:
Multi-framework JavaScript library for responsive images. Responsive images made easy.
embroider-build/app-blueprint is a:
Very experimental blueprint for scaffolding Ember v2 apps with Vite.
I had a need to dynamically load a folder images in my EmberJS app that is using embroider-build/app-blueprint and ResponsiveImage. Turns out I could use vite glob imports and resulting code looked something like:
import Component from '@glimmer/component'; import { ResponsiveImage } from '@responsive-image/ember'; const images = Object.values( import.meta.glob('/src/photos/*.jpg', { eager: true, query: '?lqip=inline&widths=1920,1280,640&responsive', import: 'default', }), ); export default class MyComponent extends Component { <template> {{#each images as |image|}} <ResponsiveImage @src={{image}} /> {{/each}} </template> } 
Top comments (0)