分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 教程案例

看得懂的 Node.js(三)—— ?Express 启航

发布时间:2023-09-06 01:09责任编辑:赖小花关键词:jsNode

如果看过上一篇《看得懂的 Node.js》,就会发现手动搭建一个 web 服务器还是比较繁琐

而 express 就是一个可以极大地提高开发效率的 web 开发框架

一、创建项目

在 express 4.0 之前,我们使用 npm install -g express 来全局安装 express

但是 4.0 之后,express 的命令行工具被单独分离出来,叫做 express-generator

npm install -g express-generator

如果了解过 vue,express-generator 和 express 的关系就像 vue-cli 和 vue 的关系

然后可以通过 express --version 命令来验证是否安装成功

然后在需要创建项目的目录下,直接使用 express 命令创建项目

express Node-Project

上面的 Node-Project 是自定义的项目名称

命令执行完成后,会在当前目录生成一个 Node-Project 项目文件夹

进入项目目录(cd Node-Project),安装依赖

npm install

然后通过 npm start 命令启动项目

npm start

开发过程中建议在 debug 环境中运行,所以通常使用这个命令启动项目:

set DEBUG=Node-Project & npm start

然后在浏览器中打开 http://localhost:3000/ 就能打开项目

如果 3000 端口被占用,可以在 bin / www 文件中修改端口

二、认识路由

在生成的项目文件中,有一个 routes 文件夹,存放着 express 框架预置的基本路由

路由一般由一个 URI、HTTP 请求(GET、POST)和若干个句柄组成

每个句柄的结构通常都是 app.METHOD(path, callback)

比如 users.js 就是一个最基本的路由

然后在 app.js 中引入模块

并配置路由结点

然后在浏览器中打开 http://localhost:3456/users 就能查看到响应内容

如果希望路由发送一个 html 页面,只需要使用 res.sendfile(url)

express 的结构中,通常在 views 中存放静态文件

假如已经在 views 文件夹下准备了一个 test.html文件,然后在 users.js 中追加一个句柄

router.get(‘/test‘, function(req, res) { ?res.sendfile("./views/test.html")});

然后打开 http://localhost:3456/users/test 就能查看到 test.html

三、加载静态文件

如果刚才的 test.html 文件中,关联了外部 css 或者 js 文件,会发现这些文件都没有被加载

看得懂的 Node.js(三)—— ?Express 启航

原文地址:http://www.cnblogs.com/wisewrong/p/7366359.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved