大家好近期呢我也是拿到了一个nodejs服务端的项目,在本地运行的还不错,结果我想发布却发现我不知从何下手,于是我就各种百度,还好通过拼凑我学会了发布,废话不多说我来做个笔记。

首先需要去阿里云或者腾讯云准备个云服务,我是在阿里云准备的云服务器ECS

宝塔支持 python django码 宝塔nodejs_node.js


购买好了后选择从装系统,我装的是Windows系统

宝塔支持 python django码 宝塔nodejs_服务器_02


确定提交等一会它就会安装好了。

进入管理系统》管理

宝塔支持 python django码 宝塔nodejs_node.js_03


宝塔支持 python django码 宝塔nodejs_服务器_04


复制公网IP,然后点击键盘“wind键”搜索“远程桌面连接”,计算机名就是你的公网IP

宝塔支持 python django码 宝塔nodejs_宝塔支持 python django码_05


输入后点击连接,然后会跳出输入密码

宝塔支持 python django码 宝塔nodejs_node.js_06


输入密码后确定等待一会就会连接上了

宝塔支持 python django码 宝塔nodejs_上传_07


连接上后去宝塔官网下载宝塔,我们是wind系统就选择wind版本

宝塔支持 python django码 宝塔nodejs_node.js_08


下载好后解压桌面,然后拷贝一下,到我们服务器系统桌面粘贴一下就可以了,然后就可以安装啦~

安装一般等待1~2分钟…

宝塔支持 python django码 宝塔nodejs_vue_09


好了安装好了后打开默认页面

宝塔支持 python django码 宝塔nodejs_上传_10


我们不想要它默认的我们来配置一下,点击关闭即可配置

宝塔支持 python django码 宝塔nodejs_node.js_11


好了配置成功,我们复制连接关闭远程桌面我们就可以在本机浏览器打开啦~

宝塔支持 python django码 宝塔nodejs_服务器_12


哎呀-最后发现网页打不开?

宝塔支持 python django码 宝塔nodejs_服务器_13

我们配置好了宝塔还不行-我们需要去服务器哪里配置一下安全组

点击——更多》网络和安全组》安全组配置

宝塔支持 python django码 宝塔nodejs_宝塔支持 python django码_14


点击——配置规则

宝塔支持 python django码 宝塔nodejs_宝塔支持 python django码_15


手动添加

宝塔支持 python django码 宝塔nodejs_vue_16


列如我们刚才宝塔配置6060 我们这边就手动添加 6060/6060。授权对象默认0.0.0.0/0 就可以了

宝塔支持 python django码 宝塔nodejs_宝塔支持 python django码_17


保存,然后重新打开我们安装宝塔时候链接

宝塔支持 python django码 宝塔nodejs_服务器_18


你就会发现进入宝塔了,然后登录一下。

首次登录绑定一下账号

宝塔支持 python django码 宝塔nodejs_宝塔支持 python django码_19


安装一下Nginx套装

宝塔支持 python django码 宝塔nodejs_vue_20


最重要的来了,我们是nodejs所需需要去安装一下PM2管理器,点击软件商城搜索“ PM2管理器 ”

宝塔支持 python django码 宝塔nodejs_node.js_21


点击文件找到wwwroot文件夹点击进去上传我们打包好的node后端压缩包。

上传成功后解压一下。

我的后端Shop

宝塔支持 python django码 宝塔nodejs_宝塔支持 python django码_22


点击首页》pm2管理器

宝塔支持 python django码 宝塔nodejs_上传_23


添加项目

宝塔支持 python django码 宝塔nodejs_node.js_24


宝塔支持 python django码 宝塔nodejs_vue_25


启动文件看你们自己的了有的人app.js,反正我的是Bind文件夹里面的www文件是我的项目启动文件,

这个要看自己的~~~

选好后提交

宝塔支持 python django码 宝塔nodejs_vue_26


提示

宝塔支持 python django码 宝塔nodejs_服务器_27


说明我们没有安装好nodejs版本

等待几分钟

宝塔支持 python django码 宝塔nodejs_node.js_28


安装成功

宝塔支持 python django码 宝塔nodejs_node.js_29


重新配置

说明了需要重新启动一下服务器然后再重新添加

宝塔支持 python django码 宝塔nodejs_上传_30


宝塔支持 python django码 宝塔nodejs_vue_31


宝塔支持 python django码 宝塔nodejs_服务器_32


服务器启动成功,然后千万记得点击—安全—放行一下你的服务器端口

比如我的4088,那我就要放行一下4088这个端口,

怎么去放行还是那样进入服务器界面,给安全组手动添加一下我们服务器的端口就行了,默认还是0.0.0.0.

放行了node后端就搭建好啦~

接下来我测试给大家看看~

宝塔支持 python django码 宝塔nodejs_上传_33


我能获取到了代表我服务器搭建成功了,那么接下来问题来了,我们该如何去搭建Vue网页呢?

这个问题我也琢磨了好久,也是各种百度,我终于琢磨明白了。

宝塔》网站》添加站点

宝塔支持 python django码 宝塔nodejs_服务器_34


域名没有的话直接添加我们公共IP就可以了。

创建成功

宝塔支持 python django码 宝塔nodejs_宝塔支持 python django码_35


把vue项目打包放在指定根目录

宝塔支持 python django码 宝塔nodejs_宝塔支持 python django码_36


如何去打包?

首先我们需要写我们vue项目的工具打开“ 终端 ”,在终端输入

npm run build

打包命令。等待几分钟你会发现多了一个“dist”文件夹,如何我们只需要压缩这里面的上传到我们指定目录解压即可~

宝塔支持 python django码 宝塔nodejs_node.js_37


到根目录把多余文件删除,然后上传在解压即可

宝塔支持 python django码 宝塔nodejs_服务器_38


宝塔支持 python django码 宝塔nodejs_vue_39


宝塔支持 python django码 宝塔nodejs_服务器_40

如果用了MySQL可以创建一个数据库

宝塔支持 python django码 宝塔nodejs_vue_41


权限记得所有人

宝塔支持 python django码 宝塔nodejs_上传_42


自己到对应node修改数据库信息保存在刷新页面

宝塔支持 python django码 宝塔nodejs_vue_43


你会发现出现了404,这时候不要慌,因为你还没有配置好

点击网站》设置》配置文件

把一下代码加进去即可

#vue-router配置
    location / {
        try_files $uri $uri/ @router;
        index index.html;
    }
    location @router {
        rewrite ^.*$ /index.html last;
    }

宝塔支持 python django码 宝塔nodejs_宝塔支持 python django码_44


然后重启一下Nginx

宝塔支持 python django码 宝塔nodejs_vue_45

宝塔支持 python django码 宝塔nodejs_上传_46


这时候你再次打开会发现是空白的?

宝塔支持 python django码 宝塔nodejs_宝塔支持 python django码_47


因为你还没有配置好数据库所有才会空白的,当然我在这里做了数据库初始化-我只需要配置好我后端的数据库连接就可以了。

宝塔支持 python django码 宝塔nodejs_vue_48


初始化成功后再次打开

宝塔支持 python django码 宝塔nodejs_node.js_49


嘿嘿嘿~~~成功了~

对啦最后特别重要的刚刚也卡了我好一会-如果你做了上传了网页不配置好那段代码的话你的网站刷新就会404~~

还有如果你服务器使用了express记得安装一下

点击首页》PM2管理器》模块管理》搜索栏那输入:express点击安装就可以了~

安装完后记得还是那样重启一下Nginx

宝塔支持 python django码 宝塔nodejs_node.js_50