Vue3-PC端项目上线 Electerm + Nginx

1、项目打包完毕

​ 项目build打包完毕，生成dist文件夹

2、购买服务器

• 腾讯云
• 阿里云
• …

3、electerm

1. 下载安装好electerm

2. 填写购买服务器主机的地址、账号、密码（其他信息非必填，根据实际情况填写），保存并连接，输入服务器密码

3. 连接成功后，在左上角，选择【sftp】，左右分别本地和服务器

4. 在服务器根目录下的【root】下新建【www】文件夹，将打包完的【dist】文件复制过去

5. 在服务器配置nginx代理，在左上角，选择【ssh】

   # 进入根目录
   # cd /
   
   # 列出所有目录
   # ls
   
   # 进入etc目录安装nginx
   # cd etc
    
   # 在etc中安装nginx
   # yum install nginx
   
   # 进入etc/nginx
   # cd nginx
   
   # 配置nginx，编辑nginx下的conf文件
   # vim nginx.conf
   
   # 按下键盘【insert】进入编辑（插入）模式
   # 修改【http/server/location】
   # 说明：告诉nginx，访问服务器的时候是访问哪个文件夹，哪个文件
   http{
   	...
   	server{
   		...
   		location / {
   			root  /root/www/dist;
   			index index.html index.html;
   		}
   	}
   }
   
   # 按下【esc】进入命令模式
   # 输入【:wq】保存
   
   # 重启nginx服务
   # systemctl restart nginx.service
   # 此时通过浏览器访问服务器会出现403（用户权限）
   
   # 配置nginx，编辑nginx下的conf文件
   # vim nginx.conf
   # 按下键盘【insert】进入编辑（插入）模式
   # 修改【user nginx;】为【user root;】
   # 按下【esc】进入命令模式
   # 输入【:wq】保存
   
   # 重启nginx服务
   # systemctl restart nginx.service
   
   # 至此项目上线成功