docker部署是主流的部署方式，極大的方便了開發(fā)部署環(huán)境，保持了環(huán)境的統(tǒng)一，也是實(shí)現(xiàn)自動化部署的前提。

1 項(xiàng)目的目錄結(jié)構(gòu)

• dist: 使用build打包命令，生成的打包目錄

  • npm run build : 打包項(xiàng)目命令

• docker: 存放docker容器需要修改的配置目錄，比如 nginx配置

• Dockerfile: 跟項(xiàng)目根目錄同級

image-20231029110929363

2 創(chuàng)建Dockerfile

• 內(nèi)容

# 指定鏡像
FROM nginx:1.24
# 設(shè)置工作目錄
WORKDIR /usr/share/nginx/html/
# 指定用戶
USER root
# 復(fù)制nginx配置文件
COPY ./docker/nginx.conf /etc/nginx/conf.d/default.conf

# 打包方式一：在容器內(nèi)打包
#           需要配置環(huán)境，比如nodejs依賴等
# RUN npm run build
# 打包方式二：本地打包，復(fù)制 打包出來的dist目錄
COPY ./dist  /usr/share/nginx/html/

# 對外暴露端口號
EXPOSE 80
# 啟動
CMD ["nginx", "-g", "daemon off;"]

• 查找nginx穩(wěn)定版本

  進(jìn)入https://hub.docker.com/_/nginx 查找stable穩(wěn)定版本

  • mainline：主線版，即開發(fā)版，學(xué)習(xí)環(huán)境可以使用，生產(chǎn)環(huán)境建議不要使用
  • stable：穩(wěn)定版，學(xué)習(xí)環(huán)境和生產(chǎn)環(huán)境都可使用
    1. stable-perl：包含最新的perl模塊的穩(wěn)定版，適合安裝在Centos上。
    2. stable-alpine-perl：包含最新的perl模塊的穩(wěn)定版，適合安裝在Alpine Linux上。
    3. stable-alpine：不包含perl模塊的穩(wěn)定版，適合安裝在Alpine Linux上。
    4. stable：包含最新的perl模塊的穩(wěn)定版，適合安裝在Centos上
  image-20231029121253853

3 生成docker鏡像

打開終端，進(jìn)入項(xiàng)目根目錄，輸入命令行

• 進(jìn)入項(xiàng)目根目錄

cd xxxx

• 生成鏡像

docker build -t user-center-ui:v0.0.1 .

image-20231029121027362

4 生成容器并啟動

docker run --name user-center-ui -p 80:80 -d user-center-ui:v0.0.1

image-20231029121557609

5 訪問

輸入http://localhost:80/xxx 即可訪問成功。

如果是在云服務(wù)器上，記得放行對應(yīng)的端口。