How can I reference an image in Meteor?

Question

I am displaying an html table in a very basic meteor app - I simply replaced the boilerplate meteor html with my html table, and it looks fine. But I need to add an image after the table, and I tried this:

. . .
</TABLE>
<img border="0" height="640" hspace="0" src="RegConvFAPSSMapWithNumbers.png" width="800" />
</body>

But where I hoped the image would be, I just see the outline of its dimensions and a "busted image" icon.

I first placed the image in the project's main directory (on the same level as <projectName>.css, <projectName>.html (the file I'm trying to add the image to), and <projectName>.js).

I then created a "public\images" folder, and copied the image into there, too, but that makes no difference.

Am I referencing the image wrong, do I have it in the wrong place, or what?

Answer 1

When you want to reference assets (images, favicon.ico, robots.txt etc.) you should create a top level public folder in your Meteor project.

Since you added your image in public/images, my guess is that you should point to a /images/my_image.png. This below should do the trick:

<img border="0" height="640" hspace="0" src="/images/RegConvFAPSSMapWithNumbers.png" width="800" />

Answer 2

Recently I had a similar problem. Just put / before the image path

src="/RegConvFAPSSMapWithNumbers.png"