前言
嘿,各位开发者朋友们!是不是每次项目要上线的时候都感觉头大?前端要构建,后端要配置,数据库要部署,还要考虑服务器环境... 简直是一团乱麻!
别担心!这篇部署指南就是来拯救你的。基于我自己的React + Node.js全栈项目实战经验,我会手把手教你从本地开发到生产上线的完整流程。我用的是腾讯云服务器 + 宝塔面板的部署方案,简单易用,适合新手。
重点是,这里没有那些官方文档的套话,都是实打实的操作步骤和踩坑经验。跟着做,保证你的项目能顺利上线!
本文详细介绍了Web项目从购买服务器到部署上线的完整流程。首先讲解了服务器选购和宝塔面板的安装配置,包括账号密码设置等注意事项。
附上官网:cloud.tencent.com/
购买
首先进入首页,去登录
顶部最新活动,点击立即抢购
选择服务器,可以选择抢购,也可以直接买,按年来说
镜像选宝塔就行
基本配置
结束后点击顶部控制台,可以看到有一台服务器
点击后来到服务器
进去后点击应用管理 点击蓝色登录,去获取宝塔的用户名和密码(复制左边的命令)
登录后直接粘贴命令,点击回车
编辑
另外有两个命令 bt 6 :重置用户名 bt 5 :重置密码,(账号密码千万要保存好)
9.设置完就可以去登录宝塔了
创建新页面,使用你注册的地址+端口+提供的路径 以 /开头的
部署
登录后,点击左边的文件菜单栏,文件默认在default目录下存储,
- 部署第一步,文件上传,前端打包好,直接上传到这。
- 点击网站,开始创建
2.1.域名格式就按默认提示的来写,可以添加端口号 ,只需加上 :你的端口号(自行模拟即可),
2.2.根目录,记得选,你刚刚上传的文件,就是dist或build,这个网站是管理前端的
3然后点击PHP旁边的项目,以node为例
3.1.正常选目录
3.2.node版本,这个选择前先去本地看一下node版本,然后选择对应的下载 这个命令 node -v
3.3.包管理器 看你的后端是什么npm 管理还是 yarn和pnpm
3.4.项目端口,可以自己写,不需要同本地一致 **记住勾选端口放行(记住这个端口,前端反向代理需要)
!!重点来了,去服务防火墙添加你的新写的端口号
3.2来源看你自己,默认Pv4就行,端口就写刚刚前后端的(一次只能添加一个)
到这一步就差前端反向代理了。
4.回到前端站点,点击站点最右边的设置,找到反向代理,点击添加
1.代理名称:在你前端配置里代理到后端的api
2.顶部开启高级功能,代理目录同上
3.目标url:这个是和后端对接的关键,写完整的路径: xx.xxx.xxx:线上后端的端口
4.路径重写:rewrite,如果配置了,就写,
OK,部署案例到此结束,接下来可以带着你的新地址去试试线上了,示例:xx.xxx.xx.xx:你前端的新端口
问题:
1.nginx :404错误 :部署成功,但是一访问页面就显示Nginx 404
点击设置,找到文件配置,找到root开头的那一行,在他下面粘贴此代码
try_files $uri $uri/ /index.html;
2.前端请求404:
云服务器防火墙前后端 端口配置
又学到新知识了,咱俩可真厉害,听说主页有火柴能点着的干货!!“真的嘛博主?” 那我就收藏+关注了