I'm new to node.js and trying to figure out how to show my image that's coded into my html file, when I'm running the .js file through node.

My image code in the HTML is in the header:

<center><img src="401kpiggybank.png" alt="Logo"></center>

and the code in my server.js file:

var http = require('http');
var fs = require('fs');
var url = require('url');
var path = require('path');
const PORT = 8080;

fs.readFile('<long file path here>', function (err, html){

    if (err) throw err; 

    http.createServer(function(request, response){
        response.writeHeader(200, {"Content-Type": "text/html"});
        response.write(html)
        response.end();
    }).listen(PORT)

})

I know the html page is working, because all other elements (it's a 401k calculator) are displaying correctly, it's just the .png file I am having troubles with.

I have tried googling it and tried to get express working, but I couldn't get it to show. Also, the image is in the same directory as the html and js files.

Any help would be appreciated.

Edit: My failed attempts at express are as follows:

var express = require('express')
var app = express();
var imgDir = require('path').join(__dirname,'/images');
app.use(express.static(imgDir));

For this attempt, I added the image file into a folder called images. I then got an error when I ran it saying Cannot find module 'express'. I did npm express and everything seemed okay, I'm not sure where to go from here.

Final edit: I tried changing the PATH of node, as well as moving the express module folder into the folder where my html/js files are.
Still returning errors. As for now I'm giving up on this and moving on.

I'll still leave the topic open.

0 Answers