Uncaught TypeError: Failed to resolve module specifier "openai"

Hello there,
I am very new to this field and this is for my class project. I tried importing openai in my script and when i ran it from my terminal everything worked just fine, but the problem arises when i tried to hook it up to a live server.

Here is a part from my main script file where i import a module that uses openai

This is the PROmpt file that uses methods that require openai (also llamaai which has the same problem)

Finally here is the file that import “openai”. The fields that are hidden are where my key is shown and some other non important imports

Here is my project structure. It is set up in a way to use react but for now it is only plain html and js because i am just starting

Also here is picture of my package.json file

Once again, I know there are probably a lot of things that are not ideal with organization and everything, my main priority right now is to get this to work and then work from there.
Thank you for all your response

EDIT: Sorry for the confusing structure of this post, it is not letting me to upload more than one picture per post

here is the picture of my package.json

and here is a picture of my overall structure