Abhishek Rastogi Abhishek Rastogi - 5 months ago 29
Node.js Question

Linked css file in jade not loading

This is what my directory structure looks like

--votingApp
app.js
node_modules
public
css
mystyle.css
views
test.jade
mixins.jade


I have written some general purpose blocks in mixins.jade. test.jade is the main file.'biolerplate','nav','nav item' are different blocks in mixins.
This is what test.jade looks like

include mixins
doctype html
html(lang="en")
head
+boilerplate
link(rel="stylesheet",type="text/css",href="../public/css/mystyle.css")
body
+nav("Voting app","navigation_menu")
+nav_item("#","active") Home
+nav_item("#") Signup
+nav_item("#") Login


And this is my app.js file

var express=require('express');
var path=require('path');
var app=express();
app.use(express.static(path.join(__dirname,'public')));
app.set('views','./views');
app.set('view engine','jade');
app.get('/',function(req,res){
res.render('test.jade');
});
app.listen(8000);


The problem is that the mystyle.css is not being loaded.The network option in the developer console of mozilla is showing that error 404 for the request for mystyle.css(request url-http://localhost:8000/public/css/mystyle.css)
What should I do please help?Thanks for reading.

Answer

Simply use this:

link(rel="stylesheet",type="text/css",href="/css/mystyle.css")