vue前端项目部署之nginx配置

vue前端项目部署之nginx配置

1、确认nginx配置完毕
2、通过命令npm run build进行打包
3、复制dist文件夹,上传至/usr/local/nginx目录下

vue前端项目部署之nginx配置_第1张图片

4、修改/usr/local/nginx/conf目录下的nginx.confvue前端项目部署之nginx配置_第2张图片

#打开文件

vi nginx.conf

#修改说明:

 监听端口:80

修改:root 后面的html

 替换为:/usr/local/nginx/dist

添加try_files帮助nginx文件查找时重定向,防止404;站点根目录,即网页文件存放的根目录, 默认主页目录在nginx安装目录的html子目录。

try_files $uri $uri/ /index.html?s=$uri&$args;

修改如下:
vue前端项目部署之nginx配置_第3张图片

5、重启nginx服务:

1、查看nginx线程

ps -ef | grep nginx

2、若有运行的nginx,则杀掉

kill -9 端口号(注意,要杀两个端口号)

3、重启服务

 /usr/local/nginx/sbin/nginx -c /usr/local/nginx/conf/nginx.conf

4、完毕
输入服务器ip即可查看

你可能感兴趣的:(nginx)