Uncaught SyntaxError: The requested module './database.js' does not provide an export named 'default'

[Paul]

I have this error when loading the component under the chrome browser (works fine in firefox).

It may be because the rest of my platform is using require.js (AMD) and there might be a conflict.

it appears to import picker.js ok but not database.js.

[Nolan Lawson]

I'm guessing this is a problem with your bundler setup. database.js definitely exports a default, you can see it here:

export default Database;

One option would be to pre-bundle the library so that it doesn't interfere with your bundler. For instance:

 mkdir tmp
 cd tmp
 npm init --yes
 npm install emoji-picker-element rollup
 npx rollup --input ./node_modules/emoji-picker-element/index.js --format esm

The above will output a single file in ESM format. No need for separate database.js and picker.js files.

What bundler are you using? E.g. Webpack/Rollup/Vite/etc.

[Paul]

Thanks, I saw that it had a default export.

My app is using an older bundling tool - (require.js which uses AMD). It does not seem to play nicely with some of the newer JS technologies when it comes to importing.

I followed your instructions and was able to use the file created from output which worked in both chrome and firefox.

thanks.

[Nolan Lawson]

Awesome! I'll close this issue then. Thanks!