在 Web 开发中，静态文件是指不需要动态生成的文件，例如 HTML、CSS、JavaScript、图片等。在 Express.js 中，使用静态文件可以提高网站的性能和用户体验。本文将介绍如何在 Express.js 中使用静态文件，并提供示例代码。
1. 安装 Express.js
在开始之前，需要先安装 Express.js。可以使用 npm 命令进行安装：
npm install express
2. 创建 Express.js 应用程序
在安装 Express.js 后，需要创建一个 Express.js 应用程序。可以使用以下代码创建一个简单的应用程序：
// javascriptcn.com 代码示例
const express = require('express');
const app = express();
app.get('/', (req, res) => {
res.send('Hello World!');
});
app.listen(3000, () => {
console.log('Example app listening on port 3000!');
});在上面的代码中，创建了一个 Express.js 应用程序，并且在根路径（'/'）上返回一个字符串（'Hello World!'）。
3. 使用静态文件
要使用静态文件，需要将静态文件放置在 Express.js 应用程序的 public 目录中。可以使用以下代码指定 public 目录：
app.use(express.static('public'));在上面的代码中，使用 Express.js 中的 express.static 中间件指定了 public 目录。这意味着，当客户端请求静态文件时，Express.js 将在 public 目录中查找该文件。
例如，如果在 public 目录中存在名为 index.html 的文件，则可以使用以下 URL 访问它：
http://localhost:3000/index.html
4. 示例代码
以下是一个完整的示例代码，包括创建 Express.js 应用程序和使用静态文件：
// javascriptcn.com 代码示例
const express = require('express');
const app = express();
app.use(express.static('public'));
app.get('/', (req, res) => {
res.send('Hello World!');
});
app.listen(3000, () => {
console.log('Example app listening on port 3000!');
});在上面的代码中，使用了 express.static 中间件指定了 public 目录，并在根路径（'/'）上返回一个字符串。可以在 public 目录中创建一个名为 index.html 的文件，然后使用以下 URL 访问它：
http://localhost:3000/index.html
5. 总结
使用静态文件可以提高网站的性能和用户体验。在 Express.js 中，可以使用 express.static 中间件指定静态文件目录。本文提供了详细的指导和示例代码，希望对您有所帮助。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/655e10b8d2f5e1655d85b1ea