Algolia autocomplete search box doesn't show up in laravel

Question

I followed the documantation:

npm install @algolia/autocomplete-js

npm install @algolia/autocomplete-theme-classic

shop.blade.php:

...
<div id="autocomplete"></div>
<script type="module">
    import { autocomplete } from './@algolia/autocomplete-js';
    import './@algolia/autocomplete-theme-classic';

    autocomplete({
        container: '#autocomplete',
        placeholder: 'Search for products',
        getSources() {
            return [];
        },
    });
</script>

When I open the page, there's not any box for searching, only <div id="autocomplete"></div> that's empty.

Please tell me what is wrong Thanks

Answer 1

Are you getting any errors in your browser developer console -- for instance, can you confirm the library loading?

I was able to build up an autocomplete box using this blog, but I'm using vanilla Javascript, not <script> modules. I can confirm, that if the code executes, you should at least see a search button/box with that code, even though there aren't any sources wired to the search box.

https://www.algolia.com/blog/ux/replicating-the-algolia-documentation-search-with-autocomplete/