利用宝塔面板部署Vue项目教程

1 安装 堡塔SSH客户端,进行SSH连接服务器

2 在Ubuntu的系统中,输入命令

wget -O install.sh http://download.bt.cn/install/install-ubuntu_6.0.sh && sudo bash install.sh

3 安装成功之后,输入服务器ip+8888端口访问宝塔面板

http://1xx.xxx.xx:12580/    //这里我已经将宝塔面板默认的端口改为了 12580

4 SSH连接之后,输入 bt 就可以列出宝塔的命令行

image-20210626121511365

5 第一次进入宝塔面板的时候,会提示你安装环境,就照默认的推荐安装即可 LNMP环境

6 进去之后,最好更换宝塔的端口,阿里云的更换教程,添加安全规则,放行相关端口

阿里云开放端口教程

7 安装环境结束之后,再在软件商店搜索安装PM2管理器,这是用来管理node项目的

image-20210626121949420

8 将本地的node_server包打包,上传到wwwroot目录下,可以再新建子目录

image-20210626122047525

​ 由于我用的是 express 托管静态资源,所以我还需要安装 express 依赖,另外上传的node_server包需要在运行过npm install 之后再上传,这样就有了所有的包

​ 补充说明:若后端项目中的启动文件(我的是app.js)是占用8888端口进行数据传输,而你的宝塔面板也是用的8888端口,就会发生端口冲突的错误。所以前面建议你先修改宝塔的端口。

9 在PM2管理器中安装 express 依赖

image-20210626122224253

10 运行后台项目,启动文件这里我的是 app.js 选好后提交即可运行。

image-20210626122327136

11 回到自己的前端项目。

首先先把自己获取后端数据的接口地址换成自己服务器的ip地址和端口号,这样注意要对应,保持一致,否则会访问不到数据,报错的。修改好之后,需要重新打包,再把打包好的dist 文件夹上传到wwwroot中。

12 点击宝塔面板网站,添加站点,输入域名和端口号,没有域名的直接输自己服务器ip 然后加个端口号,不加默认是80端口。

image-20210626122908094

建立站点成功

image-20210626123148285

13 建立站点成功之后,在wwwroot文件夹中就会有对应站点名字的文件夹,在这里面上传你打包好的dist文件夹里面的内容进行替换,这样就完成了vue项目的部署。

image-20210626123111159

评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值