Intro to Game Development with JavaScript - Full Tutorial

At around the time 24:05, when I inserted the png, it gave this error:

How do I solve this?

It is pretty typical on here for people to share a codepen / repl.it / jsfiddle example of what they have tried so that anyone helping has more of an idea of what help is actually helpful.

Please provide some example of what you’ve tried and I’m sure you’ll get more help.

Happy coding :slight_smile:

1 Like

Okay, here is the code.

Index.js

<!DOCTYPE html>
<html>
  <head>
    <title>Parcel Sandbox</title>
    <meta charset="UTF-8" />

    <style>
      #gameScreen {
        border: 1px solid black;
      }
    </style>
  </head>

  <body>
    <img id="image_ball" src="assets/images/ball.png" />

    <canvas id="gameScreen" width="800" height="600"></canvas>

    <script src="src/index.js"></script>
  </body>
</html>

can you share your file tree so that we can see what your file structure is like?

Okay here you go.

The problem comes from my png of a ball. It was working fine before. I tried to look it
up but I don’t understand the solution since I am a beginner. I double checked and it is a png like the video. All the code is the exact same as his, and his works correctly, however mine does not. It says that it can’t find the ball in path. Do I have to check to see if it exists? And how exactly do I do that? But I do know that the problem comes from the png (It’s in the assets folder, and inside the images folder). Hope that makes sense! I would also really appreciate it if you or someone else told me what the message exactly means, that way I can fix this problem if I ever get it in the future!

1 Like

Hello there,

It looks like the path you want is:
./src/assets/images/ball.png

Hope this helps

2 Likes

Thank you so much! It worked! Thank you everybody for helping me! I appreciate it!

1 Like