We Keep Coding

Cannot connect javascript to pug file in node express app

I am trying to connect a pug file to a javascript file using script. However I do not see anything viewed in the console in-spite of the console.log that I have placed there.
The following is the structure of my app.js file.
const app = express();
app.set("views", path.join(__dirname, "views"));
app.set("view engine", "pug");
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, "public")));
I have placed the pug file under the views directory and js file in the public/js folder.
I am able to render and view the pug file on load but it does not seem to be connected to the js file.
The following is the script tag I have added on my pug file.
.script(type='text/javascript', src='js/game-client.js')
This is the folder structure of my app with public and views being in the root directory
public/js/game-client.js
views/gameroom.pug
Please help me on how to proceed this. Any help is appreciated. Thank you!

Some expressjs Static Files being served while others are not

I have an odd situation what is particularly troublesome is that I have done this many times before it has to be something simple I am missing.
Please help I feel like I am loosing my mind...
Problem/Symptoms
I can load any js files from the lib folders
I can load any of the png files in the folder root/public/art under the web location //art/foo/bar.png
Can't load anything from the CSS nor js no mater what I do it all gives me 404 errors this is driving me totally crazy.
Same behavior with line 13 commented out
Same with various forms of lines 14-16
Same with and without using router
Folder Structure
Root
server.ts
public
art
art in subfolders
css
canvas.css
js
js files in folders and not
Code
import * as express from "express";
import * as path from "path";
//const express = require("express")
//const path = require("path")
let app = express()
let port = 3000
let router = express.Router();
router.use('/lib/framework', express.static( path.join(__dirname, 'node_modules','framework')));
router.use('/lib/redactedLib2', express.static(path.join(__dirname, 'node_modules', 'redactedLib2')));
router.use('/lib/redactedLib3', express.static(path.join(__dirname, 'node_modules', 'redactedLib3')));
router.get('/', (req, res) => res.sendFile(path.join(__dirname, 'index.html')))
//app.use('/art/*', express.static(path.join(__dirname, 'public', 'art')));
//app.use('/css/*', express.static(path.join(__dirname, 'public', 'css')));
//app.use('/js/*', express.static(path.join(__dirname, 'public', 'js')));
router.use('/', express.static('public'))
app.use('/', router)
app.listen(port, () => console.log(`Go to http://localhost:${port} to view.`))
Solution (Edit)
Incase anyone finds this later I was fixing it the whole time I just needed to do an empty cache and reload... If you are in chrome open dev tools F12 then click and hold on refresh and select it.

I see two issues, based on what you're showing here. First is your directory structure. Is that accurate to what your structure actually is? Because in your application you're telling Node to translate /art/* to the /public/art/ directory, but that directory is actually at /art.
Second, it's the formatting of your virtual path prefix. Drop the /*; there's no need to declare a wildcard value. It'll just mess up the pathing. The trailing / is unnessary too, though it shouldn't cause a problem. Either way, restructuring your routes to:
router.use('/lib/framework', express.static( path.join(__dirname, 'node_modules','framework')));
router.use('/lib/redactedLib2', express.static(path.join(__dirname, 'node_modules', 'redactedLib2')));
router.use('/lib/redactedLib3', express.static(path.join(__dirname, 'node_modules', 'redactedLib3')));
app.use('/art', express.static(path.join(__dirname, 'public', 'art')));
app.use('/css', express.static(path.join(__dirname, 'public', 'css')));
app.use('/js', express.static(path.join(__dirname, 'public', 'js')));
router.get('/', (req, res) => res.sendFile(path.join(__dirname, 'index.html')));
And either fixing the path joins in the app, or fixing the physical file structure, will solve the issue of loading resources that don't actually exist.

Failed to lookup view "index.ejs" in views directory

I have the following code in my express app (app.js file):
const express = require("express");
const app = express();
app.set('view engine', 'ejs');
app.get('/', function(req, res) {
res.render('index');
});
app.listen(8080);
And the following dependencies:
"ejs": "^2.6.1",
"express": "^4.16.3",
"request": "^2.87.0"
And this is my folder structure:
myapp
app.js
package.json
views
index.ejs
node_modules
[all node files]
But when I run the app, it shows this error:
Failed to lookup view "index.ejs" in views directory "mylocaldirectory/myapp/views"
If it would help here are the other error messages:
at Function.render (/mylocaldirectory/myapp/node_modules/express/lib/application.js:580:17)
at ServerResponse.render (/mylocaldirectory/myapp/node_modules/express/lib/response.js:1008:7)
at //mylocaldirectory/myapp/app.js:11:9
at Layer.handle [as handle_request] (/mylocaldirectory/myapp/node_modules/express/lib/router/layer.js:95:5)
at next (/mylocaldirectory/myapp/node_modules/express/lib/router/route.js:137:13)
at Route.dispatch (/mylocaldirectory/myapp/node_modules/express/lib/router/route.js:112:3)
at Layer.handle [as handle_request] (/mylocaldirectory/myapp/node_modules/express/lib/router/layer.js:95:5)
at /mylocaldirectory/myapp/node_modules/express/lib/router/index.js:281:22
at Function.process_params (/mylocaldirectory/myapp/node_modules/express/lib/router/index.js:335:12)
at next (/mylocaldirectory/myapp/node_modules/express/lib/router/index.js:275:10)
I get no error if I just use res.send("SOME TEXT") but when I try to render an ejs file, it doesn't. What's the issue?

You need to set your view directory and your viewengine before requesting any of your view files.
Hence you need to add the below lines, before your app.get
app.set('views', './views');
app.set('view engine', 'ejs');
And your res.render('index.ejs'); should be changed as,
res.render('index');
Hope this helps!

First you have to tell express what view engine to use by setting
javascript
// set the view engine to ejs
app.set('view engine', 'ejs');
And when referring to a view you should leave out the extension. So instead of res.render('index.ejs'); use res.render('index');.
Setting up the view folder is not required since you're using the default view folder views to store your view files.

This issue basically comes when your ejs views engine unable to find file or folder.
So do following checks:
1.check directory name. it should be 'views' not 'view'.
2.check file under directory having correct file extension or not? it should be .ejs only not others like .html or .json etc.
3.tell express that i am going to use ejs view engine by using below code:
app.set('view engine','ejs');

Did you set up the views folder?
app.set('views', './views')

I used this:
const express = require("express");
const server = express();
const path = require("path");
server.set("views", path.join(__dirname, "views"));
server.set("view engine", "ejs");
server.use(express.static("public"));
server.get("/", (req, res) => {
res.render("index");
});
server.listen(8080);

make sure you have only css files in public folder .other folders can be outside the public folder.

try this it worked for me.
// view engine setup
app.set('view engine', 'ejs');
app.set('views', __dirname + '/views');

In your case, 'app.set' function is unable to find 'views' folder.
So use following...
app.set('views', __dirname + '/views')
app.set('view engine', 'ejs')
or you can do as following
const path = require('path')
//path is inbuilt module in nodejs, so don't need to install it.
app.set('views', path.join(__dirname, '/views'))
app.set('view engine', 'ejs')
both methods are same.
__dirname will concatenate absolute path to 'views' folder.
(note: Notice that . is should not be there while concatenating with absolute directory path.
So don't use './views' after __dirname, use '/views' only)

Make Sure you have corrected file name with ejs extension.
Make Sure you have corrected folder name views.
app.set('view engine', 'ejs')
It will work properly

app.set('views', './View'); //./View(You already created folder)
app.set('view engine', 'ejs');
res.render('index', { kindDay: day });
index is my EJS file.
kindDay is EJS file-created key.

Localhost not working with node js

Following is a small server (app.js) which is is simply calling index.jade file to add jquery.js, underscore.js and backbone.js for later use. But its not working.
My directory structure is:
base
app.js
public
jquery.js
underscore.js
backbone.js
theapp.js
views
index.jade
My app.js file is:
var express= require("express"),
http = require("http"),
path = require("path");
var app= express();
app.use(express.static(__dirname+ "/public"));
app.get("/", function(req, res){
res.render("views/index.jade");
});
app.listen(3000);
My index.jade file is:
#main
script(src= "jquery.js")
script(src= "underscore.js")
script(src= "backbone.js")
script(src= "theapp.js")
When I run localhost:3000 in the browser, it says: Error: Failed to lookup view "views/index.jade"
(Localhost is working fine with another node.js program)
Please help. Thanks a lot!

Dont include the .jade
res.render("views/index");
Assuming your view engine is already setup to use Jade. (app.set('view engine', 'jade');)
You also probably dont need to specify the "views" folder, check for the line
app.set('views', path.join(__dirname, 'views'));
in your app.js - this is the root directory for your views, so you'll only need:
res.render("index");

Getting express.js to show a public folder

I've recently built a quick one page app using express.js, and this is really my first js framework (actually, my first js project, so I'm really new to this). I've got a subscription to the new typography.com cloud fonts, and I'm having trouble locating the "fonts" folder that I place in the public folder. Is there a way I need to add the folder and specify a route?
Here's my app.js file:
/**
* Module dependencies.
*/
var express = require('express'),
routes = require('./routes'),
user = require('./routes/user'),
http = require('http'),
path = require('path');
var app = express();
// all environments
app.set('port', process.env.PORT || 3000);
app.set('views', __dirname + '/views');
app.set('view engine', 'jade');
app.use(express.favicon());
app.use(express.logger('dev'));
app.use(express.bodyParser());
app.use(express.methodOverride());
app.use(app.router);
app.use(express.static('public'));
// development only
if ('development' == app.get('env')) {
app.use(express.errorHandler());
}
app.get('/', routes.index);
app.get('/users', user.list);
http.createServer(app).listen(app.get('port'), function(){
console.log('Express server listening on port ' + app.get('port'));
});
I haven't made any changes to the routes at all, so they are just default.

Please use express.static setting:
app.use(express.static(process.cwd() + '/public'));
And place your fonts folder in that public folder.

If you are using Heroku, you may want to look at this thread: Deploy Nodejs on Heroku fails serving static files located in subfolders
The guy explain that he struggled with "__dirname" until he specified the last version of NPM in his package.json:
"engines": {
"node": "0.10.11",
"npm": "1.2.25"
}
If that doesn't work, you might try:
// At the top of your web.js
process.env.PWD = process.cwd()
// Then
app.use(express.static(process.env.PWD + '/public'));
Instead of "__dirname"
Though, all that is probably useless if you already struggle localy.