为什么 Node.js 看不到 node_modules 文件夹中的文件？

有时开发人员希望从node_modules 提供一些静态资产。 通常，我们不想将您的任何内部路径暴露给外部世界。如果您的文件位于node_modules目录中，那么您可以在服务器中创建一个静态路由，从您指定的任何目录获取其文件。

express.static()函数用于提供目录中的静态文件，使用 Express 中的 express.static() 内置中间件函数。

句法：

express.static(root, [options])

参数：该函数接受以下两个参数：

• root： root 参数指定要从其中提供静态文件的目录。
• options：它是一个可选参数，包含 etag、dotfiles 等属性。

例如，如果您想从名为public的文件夹中提供静态资产，请使用以下代码。

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

现在，您的应用可以在所有 URL 上提供静态资源。

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

示例：从node_modules目录提供引导 CSS 文件。

第 1 步：首先，创建一个 NodeJS 应用程序并安装所需的模块，例如Express.js和bootstrap 。

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

第 2 步：使用以下代码创建一个index.js文件，这是我们的基本服务器。

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)
});

第 3 步：使用以下代码在根目录中创建一个index.html文件。

索引.html

HTML

  

    
     

  

    
GeeksforGeeks
 

  

说明：样式表的 URL 是/bootstrap/bootstrap.min.css ，其中/bootstrap是虚拟前缀。因此，当服务器收到来自该 URL 的请求时，服务器会在您指定的静态路径node_modules/bootstrap/dist/css上查找指定文件并将其发送给客户端。

第 4 步：使用以下命令运行服务器：

node index.js

输出：您将在终端屏幕上看到以下输出。

Server listening on Port 3000

现在打开任何浏览器并转到http://localhost:3000/ ，您将看到以下输出。