ResponsiveImage & EmberJS & glob vite imports

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>
}