Not link css file with ejs

Question

I am working with simple express node js But my main.css file does not link with header.ejs both are the same folder shown in below picture.

I have searched on google but the problem still there. my app.js file code

    var express = require("express")
    var app = express()
    var request = require("request");
    app.set("view engine", "ejs");

    app.get("/", function(req, res){
        res.render("search");
    });
    app.get("/results", function(req, res){
        var url ="http://www.omdbapi.com/?s="+req.query.search+"&apikey=my_api_key"
        request(url, function(error, response, body){
            if(!error && response.statusCode == 200){
                var data = JSON.parse(body)
                // res.send(results["Search"]);
                res.render("results",{data: data});
            }
        })
    });


    app.listen(5000,"localhost",function(){
        console.log("movie search");
    })

Answer 1

You have a wrong setup, Your view folder should only contain view files (in your case *.ejs files) but not static content. Create another folder with name 'public' at root of your node project and move your main.css there and add the following code to serve static content.

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

After this you should be able to access your main.css using localhost:5000/main.css If you see your content, The css import in your view file will start working.