幸福的奴隶 发表于 2023-4-14 10:45:50

express项目的创建

前言

前端开发者若要进行后端开发,大多都会选择node.js,在node生态下是有大量框架的,其中最受新手喜爱的便是老牌的express.js,接下来我们就从零创建一个express项目。
安装node


[*]在这里:https://nodejs.org/dist/v16.14.0/node-v16.14.0-x64.msi ,下载后直接安装。
[*]安装完成后,验证是否安装成功,win+r输入cmd,输入命令:node -v
https://img-blog.csdnimg.cn/img_convert/3173fbcb628773dd09b80cbedb466e12.png
安装淘宝镜像cnpm


[*]国内直接使用npm下载会比较慢,在cmd中输入命令安装淘宝cnpm:
npm install -g cnpm --registry=https://registry.npm.taobao.org
[*]验证cnpm是否安装成功:cnpm -v
https://img-blog.csdnimg.cn/img_convert/811abfff053313ba8a023c19fd748881.png
安装express-generator


[*]express跟大多框架一样,也是有脚手架工具的,便于项目的搭建,即express-generator。
[*]使用cnpm全局安装脚手架:cnpm install -g express-generator
[*]验证是否安装成功:express --version
https://img-blog.csdnimg.cn/img_convert/e4dc47358254d72cd854df437564e0fb.png
创建项目


[*]输入命令:express test (test为项目名) 出现下图即为创建成功。
https://img-blog.csdnimg.cn/img_convert/1975a294ffc1789437ec069e2560ae86.png
[*]项目创建后不会自动安装依赖。安装依赖命令:npm i(i为install简写) 出现下图即为安装成功。
https://img-blog.csdnimg.cn/img_convert/ce35fabd3ec007ac935e00c8c88045f5.png
[*]最终目录结构如下:
bin:项目启动脚本
node_modules:项目依赖
public:公共静态资源
routes:路由目录
views:视图目录(前后端分离开发可不用关注此)
app.js:项目入口
package-lock.json:依赖版本锁定信息
package.json:项目配置及依赖版本信息
https://img-blog.csdnimg.cn/img_convert/65a8dce7a65894499d319b133d69f5a5.png
启动项目


[*]输入命令:npm start 会出现下图
https://img-blog.csdnimg.cn/img_convert/84cf8a66986ec5a22bfbb83953bf5864.png
[*]在浏览器地址栏输入:http://localhost:3000/ 页面出现下图即为启动成功。
https://img-blog.csdnimg.cn/img_convert/a451ceb6c8d4c7b0838f4219d469178b.png
项目热更


[*]在开发过程中,每次修改代码后需要npm start重启项目后,才会使得修改后的代码生效。
[*]可以使用插件node-dev,实现项目热更。安装命令:npm i node-dev
[*]在package.json的scripts中添加:"dev": "node-dev ./bin/www"
[*]热更启动项目的命令:npm run dev
原文链接:https://xiblogs.top/?id=56

来源:https://www.cnblogs.com/xi12/p/17317806.html
免责声明:由于采集信息均来自互联网,如果侵犯了您的权益,请联系我们【E-Mail:cb@itdo.tech】 我们会及时删除侵权内容,谢谢合作!
页: [1]
查看完整版本: express项目的创建