宝塔面板部署vue+node+mysql项目上线教程，最简单的操作！

前言

自学的前端，前些天做了一个电商后台管理系统项目，就想着把这个项目发布到互联网上，但是搜寻了一遍，网上的部署教程大都比较繁琐，摸索了一天，直到凌晨一点，终于搞定了，下面就给出最简单的小白部署vue+node+mysql项目上线教程以及遇到的各种坑，方便以后回来查阅

购买云服务器和安装宝塔面板

1.打开腾讯云官网，搜索轻量应用服务器，购买轻量应用服务器，系统镜像选择centos7，服务器配置选择根据你个人喜好选择，我选了个最便宜的。
2.进入已购买的轻量服务器里面，点击远程登录，这时候你的服务器还没有密码，点击重置密码。
3.点击防火墙，添加规则，端口号填写8888，这个端口是开放给宝塔面板使用的。
4.下面进行宝塔面板的安装
点击服务器里面的远程登录，点击一键登录的登录，然后复制下面的命令到那个黑色的窗口，按下你的回车键。

yum install -y wget && wget -O install.sh http://download.bt.cn/install/install_6.0.sh && sh install.sh

安装完成后，会出现宝塔面板的入口地址和登录用户名以及密码，复制地址到浏览器打开登录即可

完善项目运行环境

点击宝塔面板的软件商店，搜索安装下面的这些软件。

点击PM2管理器的设置，可以进行模块的安装，在这里我安装了我项目运行所需的express和compression模块

添加项目数据库

点击左侧列表中的数据库，root密码改成root，

点击添加数据库，数据库名字和用户名和你要导入的数据库的备份的名字一样，密码随意，在这里我也写成root吧，在这里我要导入的是myb.sql，故数据库名和用户名为mydb

添加数据库后，点击导入，从本地上传，上传好之后，再点击一次对话框下面的导入。

上传项目文件

点击左侧列表中的文件，进入到/www/wwwroot，在这个目录里面上传后端（nodejs）项目文件夹，我的后端（nodejs）文件夹名是vue_api_server，建议在自己的电脑打开cmd命令工具，运行npm install命令，看到有那个node_modules文件夹出现后再上传vue_api_server这个文件夹

注意！！

若后端项目中的启动文件（我的是app.js）是占用8888端口进行数据传输，而你的宝塔面板也是用的8888端口，就会发生端口冲突的错误。

此时你可以选择修改app.js里的端口，或者去面板设置修改宝塔面板的端口。

在这里我选择修改宝塔面板的端口为9999。

修改端口前，需要到腾讯云服务器的防火墙那里，点击添加规则，开放9999端口。
然后再宝塔面板的设置里修改端口号为9999即可

返回上一级的/www/wwwroot/目录，在该目录创建一个文件夹，我创建的文件夹名字为vue_shop_server。

进入新建的vue_shop_server文件夹中，点击上面的终端，
运行 npm init -y，npm i express -S（此命令是我项目所需，你的项目若用不到express框架，可忽略此命令）
完成后关闭终端。

打开你的前端项目，把你项目中的获取后端数据的接口基准地址中的ip改成你服务器的ip地址，地址后面的端口号应与你的后端（nodejs）项目的app.js中的端口保持一致

修改完成后，重新打包你的前端项目，把打包好的dist文件夹上传到vue_shop_server文件夹中。

服务器运行后端项目

点击右侧列表中的软件商店，点击已安装，打开PM2管理器，找到你后端项目根目录，填写启动文件名称，项目名称随意。

最后一步，发布网站，让全世界看到！

点击左侧列表中的网站，点击添加站点，若你没有域名，直接在域名栏填写云服务器的ip地址，ip后的端口就是访问你前端项目的端口，可随意设置，我设为9999。
根目录选择你的dist文件夹的路径，点击提交。

大功告成！此时在浏览器打开你刚刚添加的网址，就可以访问啦！