Linux下部署vue项目

Linux下如何部署vue项目？Vue 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用，下面良许教程网为大家分享一下Linux下部署vue项目具体步骤。

1.部署Nginx

请参考Linux下部署nginx，此处不再重复

2.Vue项目打包

 # 打包正式环境
 npm run build:prod
 
 # 打包预发布环境
 npm run build:stage

3. 部署时可能会发现资源路径不对 ,只需修改 vue.config.js下 文件资源路径

 # 请根据自己路径来配置更改
 publicPath: './'

4. 将打包后的dist文件夹上传至服务器

本次项目路径为 /usr/local/webapp/

5.修改Nginx的conf文件

 vim /usr/local/nginx/cong/nginx.conf
 
 #修改如下
 server {
   listen 80;
   server_name localhost;
 
   # 注意设定 root路径是有dist的
   location / {
     root /usr/local/webapp/dist;
     index /index.html;
   }
 
   #跨域 ip和port自行替换
   location /adminApi {
     proxy_pass http://ip:port;
   }
 
 }

6. 使配置生效

 sbin/nginx -s reload
 sbin/nginx -s stop
 sbin/nginx

7.访问ip地址查看效果

以上就是良许教程网为各位朋友分享的Linux系统相关内容。想要了解更多Linux相关知识记得关注公众号“良许Linux”，或扫描下方二维码进行关注，更多干货等着你！