如何用Nginx将本地vue打包的dist包运行起来

第一次接触nginx自己将dist包跑起来，平常都是用后端给的xftp将dist包传到服务器上即可，特此记录一下，其实很简单

1.假设此处你已经将dist包打包完成，如果没有打包，在项目位置命令提示符敲入npm run build即可

2.安装nginx，http://nginx.org/en/download.html，选择Stable version稳定版即可，下载下来以后解压

3.将dist包放入解压好的nginx文件夹中，如图所示

image.png

4.修改conf文件夹下的nginx.conf文件，修改两处即可，第一个为监听的端口号，第二个为dist,将文件保存(如果你打包到服务器上一般默认写80端口)

image.png

5.来到之前有nginx.exe的项目目录下，在此处运行命令提示符，运行start nginx将服务启动，就可以看到你打包好的dist文件啦,localhost: + 你刚刚监听的端口号

image.png

6.由于vue是SPA，所以，当访问服务器上的路由路径时，会找不到文件然后404，所以，要添加一句tryfiles在location中，配置完的代码如下

location /{
    root disk;
    index index.html index.htm
    try_files $uri $uri/ /index.html;
}

7.其余nginx常用的操作为

start nginx        启动nginx
nginx -s quit      安全关闭
nginx -s stop      强制关闭
nginx -s reload    改变配置文件时，重启nginx工作进程，使配置生效
nginx -s reopen    打开日志文件
nginx -v           查看版本
nginx -h           查看帮助信息