HbuliderX H5前端部署+Nginx+docker20220912

1、HbuliderX   H5项目发布 ##npm run build

 

 

 

npm run build  生成dist

 

 

 

 

2、生成Nginx容器XXX80-h5

 

 

 

   

3、H5发布包dist 上传到 容器XXX80-h5  目录home/html

 1)、容器XXX80-h5创建home/html目录用来存入H5发布包dist

 

 

    

 

    2)、H5发布包dist上传到宿主机

 

 

 

 

 

 

 

 

    3)、H5发布包dist   从宿主机复制到容器XXX80-h5  的目录/home/html

 

 

 

  

 

 4、配置 Nginx容器的nginx.conf  【容器XXX80-h5】

   1）、先在宿主机  修改nginx的配置nginx.conf

 

 

 

 

proxy_pass  http://172.17.0.11:8080 后端api地址

 

 

 

   2）、宿主机配置文件nginx.conf复制到 容器XXX80-h5 的目录etc/nginx/

 

 

 

  3）、 查看 容器XXX80-h5 的目录etc/nginx/nginx.conf文件如下

  

 

 

 

 

   4)、重启容器XXX80-h5

 

 

   

 

5、访问H5项目

 

 

 

 

 

 

 

 

 

 

 

 

在windows  nginx部署h5前端项目

 

 

 

  注：proxy_pass  http://192.168.254.171:9090/   后端api