Reputation: 1149
I'm making a NodeJS app, and I've got a div element with a background-image being set in an external CSS file. The CSS file itself works absolutely fine, no problems there. Also, when I load the HTML without Node, the background image shows up just fine.
CSS:
#schoolInfo {
display: block;
background-image: url('slide1pic.jpg');
background-repeat: no-repeat;
width: 100%;
height: 100%;
background-size: cover;
}
app.js:
var express = require('express');
var app = express();
var serv = require('http').Server(app);
var io = require('socket.io')(serv);
var path = require('path');
var bodyParser = require('body-parser');
app.use(bodyParser.urlencoded({extended:false}));
app.use(bodyParser.json());
app.use(express.static('client/home'));
app.post('/createSchool', function(req, res) {
app.use(express.static('client/school'));
res.sendFile(path.join(__dirname, '/client/school/index.html'));
io.emit('updateSchool', response);
});
serv.listen(3000);
console.log("Server started on localhost://3000");
As is evident, I'm using an absolute URL, so I don't know why express can't find it. I'm getting no errors in Command Prompt (which is where I'm running the server from) or the browser's console.
Do I need to add something to my app.js? Any help would be greatly appreciated.
Upvotes: 0
Views: 3419
Reputation: 891
You are missing your routing form the url where you are serving your files:
app.use('/', express.static('client/home'));
The path '/' is relative from where you start your node process.
If you have an index.html file inside of your home directory than you can have an images folder there and your express.static() would look like this:
app.use('/images', express.static('client/home'));
And in your html file all you need is to put:
<img src="images/file.png" />
Then you just need to start you node process at:
client\home > node server.js
Upvotes: 1