express 1.1安装express And 1.2创建项目

分手后的思念是犯贱 2024-03-29 14:53 0阅读 0赞

**目录**

1.1安装express

1.2.1 创建项目

（1）使用vscode，可以快速创建项目，vscode把终端聚合在了一起，打开vscode终端

（2）进入工作目录

（3）执行创建命令

（4）此时可以看到它会自动执行

1.2.2 express项目结构分析

1、目录结构中的文件及其作用

1.2.3 应用主文件app.js

--------------------

##  ##

> **在文章里面所有命令都是在vscode的终端执行的**

## 1.1安装express ##

--------------------

要安装Express，首先要具备Node.js环境，也就是说你已经安装了Node.js。

安装Express非常简单，我们可以使用Node.js的配套工具npm命令即可安装：

$ npm install -g express-generator

npm命令运行完毕，再运行命令：

$ express --version

如果能够看到Express的版本号，证明Express已经安装成功。本文写完Express最新的版本号是4.16.1。

$ express --version

$ 4.16.1.

![25fa6b4f6c964281915ae38e30391249.png][]

我们这里安装的是一个应用生成器工具——express-generator，通过express-generator可以快速创建一个应用的骨架，为快速创建Node.js项目提供便利。

--------------------

## 1.2.1 创建项目 ##

使用Express创建项目非常简单，具体步骤如下：

### （1）使用vscode，可以快速创建项目，vscode把终端聚合在了一起，打开vscode终端 ###

![cd74d5e438f0408a909d330f687902dd.png][]

### （2）进入工作目录 ###

可以自定义一个工作目录，如下：

$ e:

$ cd express/code

### （3）执行创建命令 ###

创建一个名为hello的Express项目：

$ express hello

### （4）此时可以看到它会自动执行 ###

![802cf46423cb4b599d057fc68b6402cf.png][]

（5）创建成功之后会在code目录下出现一个名叫hello的目录，进入hello目录，然后安装依赖包：

$ cd hello

$ npm install

（6）安装完毕之后，执行命令启动应用：

$ npm start

（7）应用启动后，在浏览器中输入http://localhost:3000/网址就可以看到名叫hello的这个应用了，如图所示。

![fad0b4e00a174e35a4e2c39404d75a5c.png][]

## 1.2.2 express项目结构分析 ##

![161b20f168a94c4592d4a437948de79c.png][]

### 1、目录结构中的文件及其作用 ###

![00cf4e3ee21841d08d2cd17633a4fa78.png][]

## 1.2.3 应用主文件app.js ##

app.js文件相当于项目启动的主入口文件，有一些公共方法和服务器配置等信息。代码分析如下：

[25fa6b4f6c964281915ae38e30391249.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/28/08a1cc3d7ff44a039861d9660538fd53.png
[cd74d5e438f0408a909d330f687902dd.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/28/5ff63dd6ac034981b7a7b8bf44faeb05.png
[802cf46423cb4b599d057fc68b6402cf.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/28/5d3e37db7ac7417a80f826b3f31ef8cb.png
[fad0b4e00a174e35a4e2c39404d75a5c.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/28/1dd73ea8abe046c29dcb986e6fba68d8.png
[161b20f168a94c4592d4a437948de79c.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/28/b63c652c1c0b40918ee93a33eefeffe3.png
[00cf4e3ee21841d08d2cd17633a4fa78.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/28/c56807763d4849ce96e3e597acb7beab.png