Support ES6 module import

[o-alquimista]

I just noticed ES6 module imports don't work on the CDN-provided file.

Examples of ES6 syntax:

// import for side effects (this is how CKEditor 5 does it)
import './autocomplete-js.js';

// explicit module import
import { autocomplete } from './autocomplete-js.js';

[Haroenv]

There's an esm version here: https://cdn.jsdelivr.net/npm/@algolia/[email protected]/dist/esm/autocomplete.js

Otherwise you can always install via npm instead of via cdn

[o-alquimista]

That's great, but it doesn't work. If you look at the beginning of that file, it attempts to import some modules using invalid specifiers (@algolia/...):

import { createAutocomplete } from '@algolia/autocomplete-core';
import { createRef, debounce, getItemsCount } from '@algolia/autocomplete-shared';

[Error] TypeError: Module specifier, '@algolia/autocomplete-core' does not start with "/", "./", or "../". Referenced from http://localhost:8080/js/import/algolia-autocomplete-1.2.1/autocomplete.js

[Haroenv]

yes, it's in es-module, but with bare specifiers, you can transform it or use a cdn like snowpack / unpkg that transforms the modules

[o-alquimista]

Ouch. I don't know how to do that. I'll try again when I find some time to tinker with it.

[o-alquimista]

https://unpkg.com/@algolia/[email protected]/dist/esm/autocomplete.js

The file served by unpkg also uses bare specifiers :/

EDIT: I don't use any fancy tooling for building these things, it's just the browser and plain JS. I'll have to ditch the module approach and simply put autocomplete in the global scope.

[Haroenv]

One thing you can try is using unpkg's module transform: https://unpkg.com/@algolia/[email protected]/dist/esm/autocomplete.js?module, as explained here https://unpkg.com/#query-params

I'd still recommend in production to go for a single-file bundle, like the umd, or even better bundling yourself