vue-cli项目打包上线到阿里云服务器

一、vue-cli项目打包上线

1.首先用Xshell连接服务器

2.在本地找到自己的完成的项目，运行 npm run build命令，可以看到该项目下有一个dist的文件夹：

3.将打包好的的文件放到服务器中，我放在opt新建的vue-elemeshopcart文件夹下，输入rz找到对应项目的压缩的dist然后上传：
把上传的dist.zip解压，然后可以把可以把压缩文件删除掉：

到这步为止，我们的项目已将上传到服务器了，但是直接通过公网ip是不能访问到项目的，我们还需要通过服务器代理，我用的是nginx。

二、nginx配置

已经安装好nginx的情况下
1.通过nginx -t查看nginx所在的安装目录下，默认在/etc/目录下。输入命令行 cd /etc/nginx切换目录：

通过 cat nginx.conf可以查看当前nginx的配置文件：

2.在nginx目录下，输入 vim nginx.conf进入编辑模式，按键盘的i键，当命令行的左下角出现–INSERT–的时候，可以对文件进行编辑：


注意：listen 8083监听的是8083端口，阿里云控制台一定要开放8083端口，不然无法访问
3.完成nginx配置文件编辑后，按键盘的esc键退出编辑模式，输入:wq回车，保存修改后退出。输入nginx -s reload重启nginx配置。就可以访问我们上线的项目了。