Open In App

Why Node.js doesn’t see files in node_modules folder ?

Improve
Improve
Like Article
Like
Save
Share
Report

Sometimes developers want to serve some static asset from node_modules. Usually, we don’t want to expose any of your internal paths to the outside world. If your files are in the node_modules directory then you can make a static route in your server that fetches its files from whatever directory you specify. 

The express.static() function is used to serve the static files from a directory, use the express.static() built-in middleware function in Express.

Syntax:

express.static(root, [options])

Parameters: This function accepts the following two parameters:

  • root: The root parameter specifies the directory from where you want to serve the static file. 
  • options: It is an optional parameter that contains property like etag, dotfiles, etc.

For example, if you want to serve static assets from folder name public, then use the following code.

app.use(express.static('public'))

Now, your app can serve static resources on all URLs.

http://localhost:3000/images/kitten.jpg
http://localhost:3000/css/style.css

Example: To serve bootstrap CSS files from the node_modules directory. 

Step 1: First, create a NodeJS application and install the required modules like Express.js and bootstrap.

mkdir Project 
cd Project
npm init -y
npm i express bootstrap

Step 2: Create an index.js file which is our basic server with the following code.

index.js

Javascript




const express = require('express');
const path = require('path');    
  
const app = express();
const PORT = 3000;
  
// Static route
// Serve bootstrap CSS file 
app.use('/bootstrap'
    express.static(path.join(__dirname, 
      'node_modules/bootstrap/dist/css')));
  
// GET Request
app.get('/', (req,res)=>{
    res.sendFile(path.join(__dirname, 'index.html'));
})
  
// Start the server
app.listen(PORT, err =>{
    err ? 
    console.log("Error in server setup") :
    console.log("Server listening on Port", PORT)
});


Step 3: Create an index.html file in your root directory with the following code.

index.html

HTML




<!DOCTYPE html>
<html>
  
<head>
    <title></title>
    <link rel="stylesheet" 
      href="/bootstrap/bootstrap.min.css"
</head>
  
<body>
    <h1 class="text-success">GeeksforGeeks</h1
</body>
  
</html>


Explanation: The stylesheet’s URL is /bootstrap/bootstrap.min.css where /bootstrap is the virtual prefix. So when the server receives a request from this URL, the server lookup the specified file on your specified static path node_modules/bootstrap/dist/css and sends it to the client. 

Step 4: Run the server with the following command:

node index.js

Output: You will see the following output on the terminal screen.

Server listening on Port 3000

Now open any browser and go to http://localhost:3000/, you will see the following output.



Last Updated : 18 Apr, 2021
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads