把前端项目部署到nginx下

一、下载nginx

1.nginx官网，下载windows版本稳定版的nginx

2.将下载完成之后的nginx安装包解压到C盘或者其他盘符 (注：但是路径中不能含有中文，否则nginx启动会报错)

3.将vue项目打包，使用npm run build命令，或者其他自己配置的打包命令，打包完成之后将vue项目下生成的dist目录拷贝至nginx/html目录下

4.修改nginx的配置文件，配置修改如下

server {
  listen    80;//代理端口
  server_name 192.168.0.152;//代理名称（域名、ip）
  #charset koi8-r;

  #access_log logs/host.access.log main;

  location / {
    root test; //项目存放的地址（当前服务器位置）
    index /index.html;            
    try_files $uri $uri/ @router; //一个覆盖所有情况的候选资源：如果 URL 匹配不到任何静态资源，返回同一个 index.html 页面
  }
  location @router {
    rewrite ^.*$ /index.html last;
  }
}

5.网址http:ip+端口号（nginx 文件里配置的listen）