3. 创建 Express 项目
正式开发Express项目,我们在工作中,一般不会自己手动一点点创建项目文件。而是使用express-generator脚手架,通过它,一个命令就会自动生成项目所需要的结构了。
那么现在先来安装:
npm i -g express-generator@4
# 注意:Windows有可能碰到提示:npm : 无法加载文件 C:\Program Files\nodejs\npm.ps1,因为在此系统上禁止运行脚本。
# 如果碰到这个错误,需要用`管理员身份`打开PowerShell,然后运行:
Set-ExecutionPolicy RemoteSigned
注意下,我们需要使用-g参数,来全局安装它。
现在还需要一个专门来放项目的地方。使用 macOS,那么推荐大家可以放在家目录的Developer文件夹下。如果你还没有这个文件夹的话,可以使用这个命令来创建它,并进入其中
mkdir ~/Developer && cd ~/Developer
Windows 的同学,找一个自己熟悉的目录就好。但请务必注意,路径中不要有中文,不能有空格,否则在开发中,有可能会出现各种奇怪的错误。建好目录后,一样需要在命令行中,通过cd命令,进入其中
接着就要来创建项目了。
# 创建项目
express --no-view clwy-api
# 注意:Windows有可能碰到提示:express : 无法加载文件 C:\Program Files\nodejs\express.ps1,因为在此系统上禁止运行脚本。
# 如果碰到这个错误,需要用`管理员身份`打开PowerShell,然后运行:
Set-ExecutionPolicy RemoteSigned
# 进入项目之中
cd clwy-api
这里要注意,我们使用了--no-view参数,它的意思是不需要任何视图模板,因为我们这个项目专门做后端接口的。将来渲染页面会使用Vue和React之类的框架,所以不需要视图。然后我们项目的名字叫做clwy-api
项目创建成功后,通过命令,安装依赖包。
npm i
现在就可以通过 http://localhost:3000,来访问我们的第一个项目了。
这时候会看到欢迎页面,恭喜你,到这里,你已经成功的跑起来Node.js了。
4. 输出 json
继续来改,我们这个项目是专门开发接口的,而接口所需要的是json格式,而不是直接输出HTML。
那么找到routes/index.js文件,将中间这行改为
router.get('/', function (req, res, next) {
res.json({ message: 'Hello Node.js' });
});
它的意思就是以json格式来输出 Hello Node.js
这时候我们刷新浏览器,会发现它没有任何变化,还是显示以前的内容。这是因为当修改代码后,Express并没有一直监听我们的修改,运行的一直是之前的东西。想要显示最新修改的内容,需要重启服务。
回到命令行,按ctrl + c键,可以停止服务,接着再次运行npm start来启动服务。接着还要删掉public/index.html文件。
注意:请务必删掉index.html。很多同学到这里没有删掉index.html就去访问了,会导致无法显示json数据。
刷新浏览器后,可以看到返回的json数据了
再次恭喜你,你成功的完成了第一个Node接口了。
大家看到的浏览器中显示的样子,可能会和我的有一些小小的区别。这是因为我给浏览器安装了JSON-handle 插件,有兴趣的同学可以自行安装。如果安装碰到困难了,不安装其实也没关系。因为我们后面会学习使用apifox,它是一个专门用来调试接口的工具,而不会一直使用浏览器来调试。
5. nodemon 监听修改
做到这里,大家也发现了,当我们修改代码后,你不重启服务,它根本就不会生效。但是我们开发中,需要不断的修改代码,那要不停的重启,岂不是非常麻烦?
当然也有办法解决啦,可以安装一个叫做nodemon的包来解决这个小问题。按ctrl + c停止服务后,运行
npm i nodemon
然后打开项目根目录下的package.json,将start这里修改为
"scripts": {
"start": "nodemon ./bin/www"
},
改完后,我们再次启动服务
npm start
先来刷新一下,确定看到的是Hello Node.js。然后马上来修改routes/index.js,
router.get('/', function (req, res, next) {
res.json({ message: 'Hello node' });
});
6. 总结一下
| 命令 | 说明 |
|---|---|
| npm i -g express-generator@4 | 安装 express-generator |
| express --no-view 项目名 | 创建 Node.js 项目 |
- 开发
Node.js项目,要先安装express-generator,这样才能使用命令,创建项目 - 创建项目的命令是
express --no-view加上项目名 - 后端接口所使用的格式是:
json,而不是:HTML - 还要给项目安装、配置
nodemon,这样Express才能监听你的代码