Style sheet is not getting linked while using EJS

user_13780821 0
Viewed 112

I am learning to use ejs, express, node js. I am having probling my style sheet to my header here is my code and here is a screenshot of my code. I am using header and footer as include. Here is my header.ejs

My app.js-

const express = require("express");
const bodyParser = require("body-parser");
const ejs = require("ejs");
const app = express();
app.set("view engine", "ejs");
app.use(bodyParser.urlencoded({
    extended: true
}));
app.use(express.static("public"));
app.get("/", function(req, res) {
    res.render("home");
});
app.listen(3000, function() {
    console.log("Server started on port 3000");
});
ejs node.js css
1 Answers

2 things to note here

style.css is an external css file. So you dont need style tags inside that file. It should only contain the css.

In your express app, you have to mention the public directory from which you are serving the static files. Like css/js/image

it can be done by

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

assuming you put the css files in public folder from in your app root. now you have to refer to the css files in your tamplate files, like

<link href="/css/style.css" rel="stylesheet" type="text/css"> Here i assume you have put the css file in css folder inside your public folder.

So folder structure would be

.
./app.js
./public
    /css
        /style.css

close head tag appropriately

user_83146420
Related