Windows nginx 部署 vue项目

一、vue项目打包

正常vue_cli脚手架打包命令： npm run build

vue-element-admin 项目 打包命令： npm run build:prod

[ 两句命令区别大概是后台框架需要指定打包的环境（test,dev,prod），具体的区别还不太清楚，

参考文章：vue-element-admin部署生产环境_CrazyZomble的博客-CSDN博客  ]

可能需要修改的配置参数：

1. env.production 文件中 VUE_APP_BASSE_API='接口地址'

2. vue.config.js 文件中

     publicPath: '/',

     outputDir: 'dist',

     assetsDir: 'static'

二、nginx 部署

1. 把打包完成的vue项目dist 文件放到nginx安装路径下的html文件夹中

2. 修改nginx.conf 配置文件

server {
   listen 80;  // 端口
   server_name localhost;  // 本地IP
   #charset koi8-r;
   #access_log logs/host.access.log main;
   location / {
       root D:/software/nginx-1.17.10/html/dist;  // 打包项目地址
       try_files $uri $uri/ /index.html last;   // 指向index.html
       index index.html;
    }
}

3. nginx 相关命令行

启动：start nginx

停止：nginx -s stop（不保存相关信息）

           nginx -s quit（保存相关信息）

重启：nginx -s reload（保存相关信息）

参考文章：windows系统上部署vue项目到nginx

                  vue-element-admin部署生产环境

                  vue部署可能遇到的问题及解决方法