宝塔面板连接部署vue3+node.js+mysql

一. 安装xshell 和宝塔面板以及用xshell连接腾讯云

在软件商店下载如下的软件：

二. 宝塔面板部署

1. 部署mysql，连接远程数据库

1. 在数据库页面点击添加数据库

1. 在Navicat中将waimai数据库转储为waimai.sql

如果出现错误：

[ERR] 1273 - Unknown collation: 'utf8mb4_0900_ai_ci'

报错原因： 生成转储文件的数据库版本为8.0,要导入sql文件的数据库版本为5.6,因为是高版本导入到低版本，引起1273错误

解决方法： 打开sql文件(可以vscode打开，然后全选替换)，将文件中的所有

• utf8mb4_0900_ai_ci替换为utf8_general_ci
• utf8mb4替换为utf8 保存后再次运行sql文件，运行成功

1. 在宝塔面板中导入数据库

注：如果phpMyAdmin中waimai数据库为空，应该是数据库版本的问题，要将waimai.sql文件的内容进行替换，参考2的解决方法。

2. 部署用node.js写的后端接口

1. 在wwwroot目录下新建文件夹，上传node.js文件

1. 修改db目录下index.js文件中的user, password, database

1. 在宝塔和腾讯云添加防火墙

1. 用ApiPost测试node.js部署接口

3. 部署vue3

1. 将vue文件打包为dist文件夹，在wwwroot下新建vue项目目录，将dist文件上传到vue项目目录中

1. 在网站PHP项目中添加站点，部署vue项目

1. 开放端口要注意在腾讯云服务器添加防火墙，以及在宝塔安全中系统防火墙开放端口规则

1. 浏览器地址栏输入服务器公网：开放的端口（例如：http://114.132.65.145:81/）即可访问