第7章 使用 express-generator 创建 Express 项目

express-generator 是一个官方工具，用于快速生成一个 Express 项目的骨架。

在这篇教程中，我们将介绍如何使用 express-generator 创建一个新的 Express 项目，包括安装、命令行参数、目录结构和启动项目的整个过程。

前提条件

在开始之前，请确保你已经安装了以下工具：

• Node.js（建议使用最新的 LTS 版本）
• npm（Node.js 安装包中已包含）

安装 Express Generator

可以全局安装 express-generator。打开终端并运行以下命令：

npm install -g express-generator

创建新项目

也可以进入项目目录下，我们可以使用 express-generator 创建一个新的 Express 项目。运行以下命令：

npx express-generator myapp

这里，myapp 是项目的名称。你可以根据需要更改为其他名称。

命令行参数

express-generator 提供了一些命令行参数来定制生成的项目。常用的参数包括：

• -e 或 --ejs：使用 EJS 作为模板引擎（默认）
• -pug 或 --pug：使用 Pug 作为模板引擎
• --hbs：使用 Handlebars 作为模板引擎
• --no-view：不使用任何模板引擎
• --git：创建 .gitignore 文件

例如，使用 Pug 作为模板引擎并创建 .gitignore 文件的命令如下：

npx express-generator --pug --git myapp

安装依赖

生成项目后，进入项目目录并安装依赖：

cd myapp
npm install

目录结构

生成的项目目录结构如下：

myapp/
├── app.js
├── bin/
│   └── www
├── package.json
├── public/
│   ├── images/
│   ├── javascripts/
│   └── stylesheets/
│       └── style.css
├── routes/
│   ├── index.js
│   └── users.js
├── views/
│   ├── error.pug
│   ├── index.pug
│   └── layout.pug
└── node_modules/

• app.js：应用的主文件，设置中间件和路由。
• bin/www：启动脚本，设置服务器端口并启动服务器。
• public/：静态文件目录，存放 CSS、JavaScript 和图片等。
• routes/：路由目录，定义应用的路由。
• views/：视图目录，存放模板文件。
• node_modules/：依赖包目录。

启动项目

安装依赖后，可以启动项目：

npm start

默认情况下，应用会在 http://localhost:3000 运行。打开浏览器并访问该地址，你应该会看到一个欢迎页面。

代码示例

以下是 app.js 文件的示例代码，包含注释：

const express = require('express');
const path = require('path');
const cookieParser = require('cookie-parser');
const logger = require('morgan');

const indexRouter = require('./routes/index');
const usersRouter = require('./routes/users');

const app = express();

// 设置视图引擎
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'pug');

// 使用中间件
app.use(logger('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

// 设置路由
app.use('/', indexRouter);
app.use('/users', usersRouter);

// 捕获404并转发到错误处理器
app.use(function(req, res, next) {
  next(createError(404));
});

// 错误处理器
app.use(function(err, req, res, next) {
  // 设置本地变量，仅在开发中提供错误
  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // 渲染错误页面
  res.status(err.status || 500);
  res.render('error');
});

module.exports = app;

使用express-generator 脚手架创建 Express 项目，可以帮我们省去很多搭建项目结构的工作，推荐采用这个方式创建项目。