Express js external javascript file not loading

Question

I use an express app to serve an static pre-compiled jade file. which includes a external javascript file. but its not loaded while the page gets loaded. but i can access the javascript by the express static/public url. Why its not loading on the html?

app.js

var express = require('express'),
    path = require('path'),
    sass = require('node-sass');

var app = express();

/* default configurations */
app.set('views', __dirname + '/public');
app.engine('html', require('ejs').renderFile);

app.use(express.static(path.join(__dirname, 'public')));

/* routes */
app.get('/', function(req, res) {
  res.send('Hello World');
});

app.get('/home', function(req, res) {
  res.render('index.html');
});

module.exports = app;

index.html

  <body>
    <script type="text/javscript" src="/scripts/site.js"></script>
    <script type="text/javascript">
      window.onload = function()  {
        Site.View.init();
      }
    </script>
  </body>

site.js

var Site = Site || {};
Site.View = {
  init : function() { alert('view'); }
};

When i open the page in browser i get ReferenceError: Site is not defined

Thanks.

My first guess is that your engine is not initializing. You may want to look at how you are implementing app.engine. Almost all failures in node.js are from something simple. like missing a parameter or parenthesis. — Brian Webb
– Brian Webb, Commented Jul 28, 2014 at 18:50
@Brian i tried multiple ways even i tried res.sendfile('[path_to_the_file]profile.html') but still the js is not loaded. — Jaison Justus
– Jaison Justus, Commented Jul 28, 2014 at 19:14
Interesting. If you find this, I would love to see why you are getting this. I have always used a variant of the sample nodejs.org webserver, and ran everything up that way. — Brian Webb
– Brian Webb, Commented Jul 28, 2014 at 20:14
Can you show the directory structure of your project/app and where exactly index.html and site.js are in that structure? — mscdex
– mscdex, Commented Jul 28, 2014 at 20:48

benxgao · Accepted Answer · 2014-07-29 03:31:06Z

1

Add app.use('/public/js', express.static(path.join(__dirname, '/public/scripts'))); to app.js, in order to indicate the subfolders of the pulic folder;

If it still not works, change src="/scripts/site.js" to src="/public/scripts/site.js";

answered Jul 29, 2014 at 3:31

benxgao

3711 gold badge3 silver badges10 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Neeman · Accepted Answer · 2014-07-29 05:46:08Z

0

site.js must be inside public/scripts from your root directory.

I am not sure but both views and express static pages are gone to public directory in your code. Use default configuration as: app.set('views', __dirname + '/views'); app.set('view engine', 'ejs'); app.use(express.static(path.join(__dirname, 'public')));

answered Jul 29, 2014 at 5:46

Neeman

1262 silver badges10 bronze badges

Comments

Akash Agarwal · Accepted Answer · 2016-04-10 20:16:04Z

0

You may also add a route for it like this:

app.get('scripts/site.js', function(req, res){
    res.send('./scripts/site.js');
}

answered Apr 10, 2016 at 20:16

Akash Agarwal

2,5702 gold badges32 silver badges62 bronze badges

Collectives™ on Stack Overflow

Express js external javascript file not loading

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related