Search bar not working

[tryingtocode]

Hi all! I am trying to make a search bar here where a table pops up after you look up a city in Michigan. (To test, try typing “Detroit”)

Amplified Materialistic Fiction

I’m trying to figure out what I’m doing wrong. I think the javscript file doesn’t recognize the json.

Thank you for reading!

[_tr]

Hi and welcome to the community, @tryingtocode!
Looks like you have an error on the console:

Uncaught SyntaxError: Cannot use import statement outside a module

You need to make your script file a module (type="module") before using import statements. Try using this:

<script src="mainsearch.js" type="module"></script>

Instead of <script src="mainsearch.js"></script>.

Note: By making the file a module, please note that any variables or functions defined inside the function will not be accessible by any other script. Exception for uses like window.x = x

[tryingtocode]

Hi! Thank you so much for your reply – I appreciate it!

Unfortunately that didn’t seem to do the trick. I think the issue is that the

var fuse = new Fuse(list, options);

Is not matching the json file. (I’m trying to do something I did with a past project, seen here: https://warn-notices.glitch.me

But just not quite sure what I’m getting wrong!

[_tr]

Hello again!
Looks like there’s other error:

Uncaught TypeError: Failed to resolve module specifier "fuse.js". Relative references must start with either "/", "./", or "../".

You need to remove this line from the script:

import Fuse from 'fuse.js'

This is because the client-side doesn’t support this kind of import. Plus, you’re already importing it from the <script> you have on the webpage.