The local script is not getting loaded into the html file

Well… this sounds very simple but somehow not able to figure it out.

Here is the project on GitHub: https://github.com/atapas/js-keycodes-demo

Deployed on Netlify: https://app.netlify.com/sites/keyevents/overview

The Site is available on https://keyevents.netlify.app/

I have a script file named, index.js under the scripts folder which I am calling in the index.html file using the <script> tag. However, when I deploy, this script is not being imported. I do not see it being loaded in the browser debugger devtool as well.

image

What I may be missing here? It works locally using a webserver(or live server). Interesting to see that, the CSS file has been imported correctly.

You’re adding the <script> to <body> and also added the defer attribute. Use either one of them.

However, from what I can see, the script is loading:

It’s probably not executing though.

I had tried without defer before…now removed that too. Could you please check once and see if can suggest anything here?

The real problem is that you’re closing <script> tag inline, that is <script src="./scripts/index.js"/>. This is invalid HTML. <script> tag needs to be closed separately. I don’t know how it worked locally for you, but it didn’t work for me. I changed it to <script src="./scripts/index.js"></script> and it works.

1 Like

That’s strange! It’s working for me using Live Server.

Thanks for your suggestion. Let me make the changes and deploy.

1 Like