nginx 部署前端项目

（1)  先上传项目到 git  记得不要把node_module  上传了 

（2）登录服务器， 创建一个空文件夹 命名 例如 music_vue

  (3)  从远程克隆项目  先 npm  install    再npm  run  build  

  (4)  前端项目 注意不要用 history  路由

（5）如果在服务器创建了文件夹  我们要设置   publicPath

  比如：设置上级目录下的 ./  这里可以不做判断

publicPath: process.env.NODE_ENV === 'production' ? './' : './'

  （6） 接口判断：axios

const baseURL = process.env.NODE_ENV === 'production' ? 'http://xxxxxxxxx/' : '/'

(7) 可以先测试 

 测试项目的静态文件 ,  npm  run  build  看看可以在本地访问到不

 测试接口  访问接口路径  看看可以请求到接口不 

（8） 开放端口  这里设置安全组开放前端 后端端口

 （9） 设置nginx  代理 

 

 

music.conf 的内容：

server_name music.xxx.xxxxx; 是网站路径

proxy_pass  http:/xxxxx:9003; # 代码接口的url;

server {
        listen 80;
        server_name music.xxxx.xxxx;
        location / {
           root /root/music-vue/dist;
           index index.php index.html index.htm; 
        }
        location /api { 
           proxy_pass  http://xxxxx:9003; # 接口的url;
           proxy_buffer_size 64k;
           proxy_buffers   32 32k;
           proxy_set_header X-Real-IP $remote_addr;
           proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
           proxy_set_header Host $http_host;
           proxy_set_header X-NginX-Proxy true;
       }
 }

 (10)  啊里云 域名解析