I cannot seem to get express 3.x to server up static files in my public directory. They all request end with 404.
var express = require('express')
, engine = require('ejs')
, app = express();
app.configure(function () {
app.use(express.static(__dirname + '/public'));
app.set('views', __dirname + '/views');
app.set('view engine', 'ejs');
});
app.get('/', function(req, res) {
res.render('test.ejs')
});
app.listen(3000);
My test.ejs is had references to the js files that look like so:
<script type="text/javascript" src="js/testscene.js"></script>
I must be overlooking something simple. I have the following folder structure:
project
-public
-js
testscene.js
-views ]
Can someone tell me what I've missed?
Update
I actually created a new project and copied my script into this new project and it works?!
I guess Ill just have to close this as some sort of localized weirdness. Thanks for all of your time.
__dirname is the directory where the current .js file resides. Your filesystem ascii art diagram omits this essential piece of the puzzle. If your first code snippet lives at project/server.js, for example, then that is correct. I think then loading http://localhost:3000 in your browser should properly find the js/testscene.js file. However, using relative URIs is usually a bad idea unless you really are sure you want/need it, so for the sake of sanity, change that to be src="/js/testscene.js".
Related
profile.ejs file name saved in view folder, and on every request it gave status code: 500 error. Just on changing the folder name from view to views, its start working. No server internal error, no invalid command error, don't know why?
var express = require('express');
var app = express();
app.set('view engine', 'ejs');
app.get('/home',function(req, res){
res.sendFile(__dirname + '/index.html');
});
app.get('/profile/:name', function(req, res){
res.render('profile');
});
app.listen(3000);
just changing the directory same code start working, explain please!
Thank you.
Directory views is default directory of express template engine. After app.set('view engine', 'ejs'), Express will look for (your-project-directory)/views and set that directory as default.
If you don't want default behavior, you can specify the path to directory as your desire using:
app.set('views', 'path/to/your/template');
For example: If your want to name your directory view instead of views
app.set('views', './view');
I have a Node Server with Express. I get the cannot find module 'html' error even though my code looks like this and should be correct in my opinion:
app.set('views', path.join(__dirname, 'build/views'));
app.use(favicon(path.join(__dirname, "build/favicon.ico")));
app.use('/scripts', express.static(path.join(__dirname, 'node_modules')));
app.use(express.static(path.join(__dirname, 'build')));
app.get('/', function(req, res){
res.render('index.html');
});
You have to set engine for HTML
Include this code in your main file
var engines = require('consolidate');
app.engine('html', engines.mustache);
app.set('view engine', 'html');
If you only want to serve a static file without passing any variables from the server to the client the easiest solution would be:
res.sendFile(path.join(__dirname + '/build/views/index.html'));
Especially when you are using AngularJS for the client side. The problem with the solution above is that mustache uses {{}} as variables recognition. So does AngularJS which might causes errors!
It seems that you are trying to display a static index.html file but you serve it as if it was a template. Probably Express is trying to find a module for html template format, which doesn't exist.
You may try to send the index as a static file instead of with res.render which is for rendering templates.
Some time ago I wrote an example of serving static files with Express. It's available on GitHub:
https://github.com/rsp/node-express-static-example
See also my other answer, where I explain it in more detail.
In my node app, I configured the views folder, later simply I am passing the html name alone. now the html file need to load from using the views config + html file right. ( am I wrong!)
But it's not working. any one give me the suggestion please?
here is my code :
var express = require('express'),
http = require('http'),
jade = require('jade'),
app = express();
app.set('view engine', 'jade');
app.set('views', __dirname + '/views'); // i configured the path so i am passing file name alone on get.
app.get('/', function(req,res){
res.sendfile('index.html'); //it's not working
res.sendfile('views/index.html') //it works
});
http.createServer(app).listen(3000, function () {
console.log('Express server listening on port ');
});
thanks in advance
You appear to have a misconception about what the view engine is. The view engine takes some non-HTML code, and transforms it into HTML. Here, you have it set to use jade.
The view engine is only good with the res.render() function. res.sendfile() merely sends a file from the current directory -- not the views directory.
Using express if you want to serve some static HTML files. You can just put those files directly in public folder.
When server will get a GET request of / it will search for /public/index.html serve that as response. You don't have to add router for that /.
Other wise if you want to use some template views then you have to use some views engine.
I am using node.js with express web framework and with jade template parser.
I am following the bootstrap examples and have problems with holder.js.
I have put holder.js script into static files (public directory), having in app.js the following:
app.use(express.static(path.join(__dirname, 'public')));
I wanted to display some images with following code in jade template:
img(data-src='/holder.js/500x500/auto')
And it does not work. I checked through the browser and I am able to see holder.js file correctly, but adding any parameters is causing that main page is displayed instead.
I am suspecting that static files handler thinks that there is no such file as holder/500x500/auto and redirects to main page. How can I fix that?
Here is a Runnable with Express and Jade with a couple of Holder placeholders: http://runnable.com/U6IlNqsTu-cR6ZT8/holder-js-in-express-using-jade-for-node-js-and-hello-world
The two placeholders use different themes, with one using the auto flag.
server.js:
var express = require('express')
var app = express();
app.set('view engine', 'jade')
app.get('/', function(req, res){
res.render('index')
})
var server = app.listen(80, function(){})
views/index.jade:
doctype html
html
body
script(src='//cdnjs.cloudflare.com/ajax/libs/holder/2.3.1/holder.min.js')
img(data-src='holder.js/200x200/lava/auto')
img(data-src='holder.js/200x200/sky')
Take the leading slash out of the data-src attribute: holder.js/500x500/auto.
I hope you are well.
I'm suddenly unable to render any external javascript in jade templates! To get to the bottom of things, I stripped it down to the bare minimum :
Node 0.6.11, Express 2.5.8, jade 0.20.3
app.js
var express = require('express')
, routes = require('./routes');
var app = module.exports = express.createServer();
app.configure(function(){
app.set('views', __dirname + '/views');
app.set('view engine', 'jade');
app.use(express.bodyParser());
app.use(express.methodOverride());
app.use(app.router);
app.use(express.static(__dirname + '/public'));
});
app.configure('development', function(){
app.use(express.errorHandler({ dumpExceptions: true, showStack: true }));
});
app.configure('production', function(){
app.use(express.errorHandler());
});
app.get('/', function(req, res){
res.render('index', { title: 'Express' });
});
app.listen(3000);
layout.jade
!!!
html
head
title= title
link(rel='stylesheet', href='/stylesheets/style.css')
script(type='text/javascript', src='/javascripts/script.js')
body!= body
script.js
alert('hello!');
It seems to me that when I run the server and load http://localhost:3000/, I should straightaway get a 'hello!' message, but it just runs straight to the normal page.
What's more, if I manually type
script
alert('hello!')
into the layout.jade template I get the message just as I should. It is just not loading the static script. And I have certainly checked that 'script.js' is in '/public/javascripts/' just as it should be.
Any advice would be very welcome!!!
Thanks in advance
you need to pass your script from the controller like that:
app.get('/', function(req, res){
res.render('index', { title: 'Express', scripts: ['javascripts/script.js']});
});
and then in your head in layout.jade:
- each s in scripts
script(src=s)
Make sure your js files are exposed as static resources.
In layout.jade...
!!!5
html
head
script(src='js/helper.js')
In app.js...
app.use(express.static(__dirname + '/public'));
Once I put the 'js' folder under the 'public' folder, helper.js loaded without issue. Simple, but I'm new to this whole thing and I didn't get that at first.
Why do you have a beginning forward slash '/' in your Jade script tag? With your script in <root_dir>/public/javascripts/script.js, the correct way to reference it in Jade is script(src="javascripts/script.js"). At least that is what is working on my installation. The same is true for other assets like CSS or images in the /public directory.
Thanks to Rob (you can find his answer above), for pointing in right direction. I just want to add a little reference so it might seem more natural than any magic.
In the express documentation here, its mentioned that if static files like css, images etc are to be served then one need to declare it using
app.use(express.static("_dirName"));
I was facing same issue with using images in html code. With this, it works fine now.