? ? ? ? 使用docker部署uniApp打包后的H5項目記錄，好像和VUE項目打包沒什么區(qū)別...

用HX打開項目，首先調(diào)整manifest.json文件

開始用HX打包

填服務(wù)器域名和端口號~

打包完成后可以看到控制臺信息

我們可以在web文件夾下拿到下面打包好的靜態(tài)文件

用FinalShell或者XShell遠程連接工具連接服務(wù)器

? ? ? ? ?默認服務(wù)器已經(jīng)配好docker環(huán)境和防火墻。然后隨便找個位置建文件夾，并配置docker部署等文件~，下面是部署前的文件夾

dist 項目打包文件夾，把HX打包得到的web文件夾里的所有文件復(fù)制到里面。

default.conf Nginx配置文件，構(gòu)建容器時掛載到容器中

upstream my_server{server xxxxxxxxx; # 后端server 地址keepalive 2000;
}server {listen       80; #這里的端口號不要動，80端口指的是容器的端口，最后我們會將容器的端口映射到我們宿主服務(wù)器的端口，比如映射到8888端口server_name  xxxxxxxxx; # 修改為docker服務(wù)宿主機的ip/域名#charset koi8-r;access_log  /var/log/nginx/host.access.log  main;error_log  /var/log/nginx/error.log  error;location / {root   /usr/share/nginx/html;index  index.html index.htm;try_files $uri $uri/ /index.html =404;}#  這里就是和vue本地代理的意思一樣，已api開頭的路徑都代理到本機的3000端口location /api/ {proxy_pass http://my_server/api;proxy_set_header Host $host:$server_port;rewrite ^/api/(.*) /$1 break;}error_page   500 502 503 504  /50x.html;location = /50x.html {root   html;}}

Dockerfile 容器構(gòu)建文件

# 使用NGINX作為基礎(chǔ)鏡像
FROM nginx# 復(fù)制解壓后的網(wǎng)站文件到NGINX默認路徑下
COPY dist/ /usr/share/nginx/html/
# 將你的 NGINX 配置文件復(fù)制到容器中的 NGINX 配置目錄
COPY default.conf /etc/nginx/conf.d/default.conf

set.sh 啟動腳本

docker build -t test-app.docker run -d -p 9000:80 --name test-app test-app

最后運行./ set.sh

最后打開瀏覽器輸入域名（IP） + 端口號

搞定~