So I'm making a simple Express.JS web app.
I have some assets in /public (for example, public/images/main-back.png
).
In index.scss I do:
background-image: url('../../../images/main-back.png');
And in Chrome console I get an error:
GET http://localhost:3000/images/main-back.png net::ERR_CONNECTION_REFUSED
When I refresh the page several times, this request may pass one time and the image will show on the page.
The configuration is more or less default, I have the default bin/www file. It listens on port 3000:
var server = http.createServer(app);
/**
* Listen on provided port, on all network interfaces.
*/
server.listen(port);
The app has pre-configured assets serving by default. in app.js I have:
app.use(express.static(path.join(__dirname, 'public')));
The question is - why is it not working?
UPD: In the default project which was created by Express generator, there is
app.use(express.static(path.join(__dirname, 'public')));
in app.js. I added app.use(sassMiddleware) before this app.use, and this leaded to the bug I'm talking about. But when I place the app.use(sassMiddleware) after the
app.use(express.static(path.join(__dirname, 'public')));
Then the css files don't update on scss file change. What should I do?