nginx部署vue项目的步骤

1. 下载nginx

nginx下载地址

nginx部署vue项目的步骤_第1张图片

2.npm run build 打包vue项目

nginx部署vue项目的步骤_第2张图片 

3. 找到打包好的资源,一般在项目路径/dist的目录下,copy全量资源到nginx的html目录下

nginx部署vue项目的步骤_第3张图片

 nginx部署vue项目的步骤_第4张图片

4.修改nginx的conf目录下的 nginx.conf文件内容(这里的host变量,不知道为什么本地部署时,一定要指定服务端host域名才可以访问到,否则会接口404)

nginx部署vue项目的步骤_第5张图片

 5.启动nginx,通过localhost:端口访问即可

你可能感兴趣的:(nginx,前端,运维)