node + express简单地部署静态页面

在我们写一些静态页面,页面需要使用http访问进行测试的时候,一般的IDE都有相关的插件,可以直接通过http进行访问测试,但是如果IDE不自带这个功能,或者你不想使用这个功能,那我们怎么通过node来实现简单的静态页面转发呢?

步骤:
1,npm安装express
首先电脑要已经安装了node,需要连外网,运行运行指令npm install express -D,等待安装(直接通过npm安装较慢,安装了cnpm的可以通过cnpm安装)。

2,编写启动脚本
新建一个js文件,例如文件名为app.js,键入以下代码:

const express = require("express")

const server = express();
   
server.listen(3001, function () { //在3001端口启动
    console.log('Example app listening on port 3001');
})

server.use('', express.static('./'))

3,执行启动脚本
用node运行app.js:node app.js
执行成功后,就可以通过http://localhost:3001访问到app.js同级的静态页面了。

比如文档目录如下:
在这里插入图片描述
启动app.js后,即可通过 http://localhost:3001/a.html 访问到a.html的页面了,效果如下:
在这里插入图片描述

  • 1
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
要将Node.js + Express + Vue3 + Vite应用程序部署到阿里云上,您可以按照以下步骤进行操作: 1. 在阿里云上创建一个ECS实例,选择适合您需求的操作系统和配置。确保您在安全组中打开了HTTP(80端口)和HTTPS(443端口)的访问权限。 2. 在本地开发环境中构建Vue3应用程序。在项目根目录下打开终端或命令提示符,运行以下命令: ```bash npm run build ``` 这将使用Vite构建工具编译和打包Vue3应用程序,并将生成的静态文件保存在`dist`目录中。 3. 将Vue3应用程序的静态文件上传到阿里云ECS实例。您可以使用FTP工具(如FileZilla)将`dist`目录中的文件上传到ECS实例的`/var/www/html`目录(或您自定义的web目录)。 4. 在ECS实例上安装Node.js和npm。您可以通过SSH远程连接到ECS实例并使用以下命令安装它们: ```bash # 安装Node.js curl -fsSL https://deb.nodesource.com/setup_14.x | sudo -E bash - sudo apt-get install -y nodejs # 安装npm sudo apt-get install -y npm ``` 5. 在ECS实例上创建一个名为`server.js`的文件,并添加以下内容: ```javascript const express = require('express'); const path = require('path'); const app = express(); // 静态文件托管 app.use(express.static(path.join(__dirname, 'html'))); // 所有路由重定向到index.html app.get('*', (req, res) => { res.sendFile(path.join(__dirname, 'html', 'index.html')); }); // 启动服务器 const port = process.env.PORT || 80; app.listen(port, () => { console.log(`Server is running on port ${port}`); }); ``` 在上述示例中,我们使用Express创建了一个简单的服务器。我们通过`express.static`中间件来托管上传的Vue3应用程序的静态文件,然后将所有路由重定向到`index.html`以支持Vue的单页应用。最后,我们使用`app.listen`方法来启动服务器,并指定端口号为80。 6. 在ECS实例上运行以下命令来安装Express和其他项目依赖: ```bash npm install express ``` 7. 在ECS实例上运行以下命令启动Express服务器: ```bash node server.js ``` 这将在ECS实例上启动Express服务器,并监听端口80。 8. 现在,您的Node.js + Express + Vue3 + Vite应用程序已经在阿里云ECS实例上运行起来了。您可以在浏览器中访问ECS实例的公网IP地址来查看应用程序。 请注意,上述示例仅提供了一个简单部署流程,并且假设您已经完成了阿里云ECS实例的设置和配置。在实际部署过程中,您可能还需要考虑安全性、性能优化、域名绑定等方面的问题。另外,您可能还需要使用Nginx等工具来配置反向代理或实现负载均衡等功能。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值