云服务器部署vue项目

目录

1.不用nginx，单纯的部署（失败）

2.利用nginx 部署

3.利用宝塔面板部署

---

vue项目进行npm run build的命令， 生成一个dist包。记得开放对应的端口号

1.不用nginx，单纯的部署（失败）

将dist包通过xftp传进云服务器的根目录下 /root 下面

记得要把dist里面的文件放进root目录下，而不是dist包放在目录下

 然后，根据前端大哥说理论上讲直接访问服务器地址就可以访问，默认配置的路径就是root ，然而不行，试了试调整dist包放在root下，还是不行，然后开始尝试nginx

2.利用nginx 部署

云服务器用的是阿里云，宝塔面板，直接在终端安装 yum install nginx，显示没有源，安装不上

 其实宝塔面板是可以配置nginx、mysql、tomcat......的，只是安装系统的时候没有，需要手动配置一下

 配置按照云服务器的流程来即可，说的挺详细的，先登录远程服务器，然后获取面版入口，获取面板用户名和密码

第一次登录面板会提示一键配置环境，我只安装了nginx ，网上推荐安装左边的LNMP 安装方式选择编译安装。（图不对，尽量不要选择快速安装），错过了第一次登录的一键配置也没关系，之后可以在宝塔面板的软件商店选择安装。

 安装完nginx之后 在终端输入find / -name nginx.conf   查找一下nginx的配置文件路径

 然后修改配置文件vim   /www/server/nginx/conf/nginx.conf

 

  然后将build好的dist包放在配置的项目目录下，之后输入命令nginx -s stop来关闭nginx 再输入命令nginx 启动nginx

 然后输入地址和端口号访问就可以了！

3.利用宝塔面板部署

之前已经讲了怎么登录宝塔面板，进入面板后点网站，添加站点 

 

 添加完点提交，然后访问ip:端口， 会出现下图说明配置好了

 然后将dist包下文件放进刚才添加站点配置的根目录下（重复文件覆盖），就可以了！