I am trying to display images with amplify-s3-image in a Vue 3 project, but cannot get it working. The error message is "GET http://localhost:5173/node_modules/.vite/deps/amplify-s3-image.entry.js net::ERR_ABORTED 504 (Gateway Timeout).
I suspect that I didn't set up the main.ts file properly. I am using the following code:
import {
applyPolyfills,
defineCustomElements,
} from '@aws-amplify/ui-components/loader';
Amplify.configure(aws_exports);
applyPolyfills().then(() => {
defineCustomElements(window);
});
const app = createApp(App);
app.config.compilerOptions.isCustomElement = tag => tag.startsWith('amplify-');
app.mount("#app");
What did I do wrong? Is there a better approach to import reference to amplify-s3-image? How to use AWS custom elements anyway? Thanks!