Scripts not being called Scripts not being called express express

Scripts not being called


Step 1

In your node.js file locate the part where you configure the express.

It would be like.

 var express = require('express')               , app = express(); app.configure(function() {    //configure the express codes go here }

in that check out the line of code where you configure the folder which serves the static files. like images,css, and js. I would be like.

app.use(express.static(__dirname + '/public'));

here in the above case public should be exactly the name of the parent folder which holds the stylesheets and javascripts folder that you mentioned in the above html.

like

--app.js--package.json--views/--node_modules/--public/     --stylesheets/        --testing.css     --javascripts/        --jquery-1.9.1.js        --jquery-ui-1.10.2.custom.js        --testing.js

Step 2

If the above is configured correctly then you can make sure

app.use(express.static(__dirname + '/public'));

in config comes ahead of

app.use(app.router);

so that you can make assure that your line is not ignored by a 404 route handler you written in the router.

Step 3

You can inspect the rendered page with Firebug or Chrome inspector and check in the networks tab what was the response you received for the js and css files you have mentioned.As per you question it should be 404 file not found and if its something else you should update it in the question.

Step 4

If you still cant fix the issue then you have to update the question with the node.js codes you are using. So that we could look into it.


i believe it is that "/" in start of every src line which is not making it load. for example .. use them this way

<link rel="stylesheet" href="stylesheets/testing.css" type="text/css" media="screen" charset="utf-8"/><script type="text/javascript" src="javascripts/jquery-1.9.1.js"></script><script src="javascripts/jquery-ui-1.10.2.custom.js" type="text/javascript" charset="utf-8"></script><script type="text/javascript" src="javascripts/testing.js"></script>

well, these scripts and css files are in their respective folders and to reference to them, you just have to start the source from its name directly, e-g src="folder/script.css"

This was if folders are one level above from html file. for example

your index.html file is in folder1

your style.css file is in folder1 >> css

your script.js file is in folder1 >> scripts

then for this level, above suggestion will 100% work. If other types of levels are there, e-g

index.html is in folder1 >> folder2 >> index.html

style.css is in folder1 >> css

script.js is in folder1 >> js

then your src should look like

<link rel="stylesheet" href="./stylesheets/testing.css" type="text/css" media="screen" charset="utf-8"/><script type="text/javascript" src="./javascripts/jquery-1.9.1.js"></script><script src="./javascripts/jquery-ui-1.10.2.custom.js" type="text/javascript" charset="utf-8"></script><script type="text/javascript" src="./javascripts/testing.js"></script>

please note a "." dot in start. It means the code will reference the file from one folder behind. if the file is 2 folders behind, then use it two times, e-g ././folder1/css

hope that helps


You have to set expressJS to to use static links linking your assets or public folder that contain js and css folders.

express.static(__dirname + '/assets', { maxAge: 24*60*60*1000 }

Then use dots at the beginning of href links or simply add server url instead. e.g. :

<link rel="stylesheet" href="../css/test.css" type="text/css" >