Nginx部署Vue项目以及解决刷新页面404问题的教程

第一步在控制台终端输入npm run build
打包完成之后项目中会生成一个dist文件夹

第二步 将里面的static文件和index.html文件打成压缩包

第三步 将压缩包上传至服务器

第四步 解压此文件到nginx/html/目录下，并将nginx/html原文件删除

第五步 输入服务器ip+nginx配置端口号即可访问页面

第六步 进入页面刷新会404
解决项目部署到nginx服务器中刷新页面404的问题
1、 进入nginx配置文件目录

cd nginx/conf/
2.编辑配置文件nginx.conf

vi nginx.conf

输入命令 i 进入编辑模式,在指定位置添加代码

location / {
root …
index …
try_files $uri $uri/ /index.html; —解决页面刷新404问题
}
3. 保存退出

i --编辑
esc然后
:w --保存
:quit --退出

第七步：重启nginx服务
进入安装目录中，

命令： cd /usr/local/nginx/sbin

启动，关闭，重启，命令：

./nginx 启动

./nginx -s stop 关闭

./nginx -s reload 重启