Docker雲端部署篇

本文轉載自查看原文 2020-08-23 15:03 627 Docker

新建 docker/nginx.conf

server{
      lister 80;
      
      location /{
        root /usr/share/ngin/html;
        index index.html;      
      }
}

新建 docker/Dockerfile

FROM nginx:alpine

COPY ./nginx.conf /etc/nginx/conf.d/default.conf #宿主機nginx.conf 覆蓋掉 容器里的default.conf
COPY ./dest /usr/share/nginx/html #把當前目錄里的dest 文件夾復制到容器里的html目錄里

新建 docker/build.sh 打包vue

npm run build # 打包vue
cp -r ../dist ./  #復制dist目錄的docker目錄里
docker build -t giligili:v1.0.0  # 基於當前目錄里的Dockerfile打包vue項目為容器
docker push giligili:v1.0.0 # 推送容器

在docker目錄里手動啟動nginx容器

docker run -p 9999:80 nginx:alpine
docker run -it nginx:alpine sh
ls -als

在項目docker目錄手動打包vue並打包為本地容器

npm run build #  打包vue
docker build -t giligili:v0.0.1 ./ # 基於當前目錄里的Dockerfile打包vue項目為容器

cp -r ./dist docker

運行容器

docker run -p 9999:80 giligili:v0.0.0.1

已經可以正常訪問了

建立自己的阿里雲鏡像倉庫

登陸->控制台->產品與服務->搜索鏡像->鏡像容器服務

創建命名空間

創建鏡像倉庫

設置docker倉庫的登陸密碼

進入管理倉庫

重新編寫本地的 build.sh

獲取阿里雲倉庫地址

npm run build # 打包vue
cp -r ../dist ./  #復制dist目錄的docker目錄里
docker build -t registry.cn-hangzhou.aliyuncs.com/haimablog/haimablog:v1.0.0 ./  # 基於當前目錄里的Dockerfile打包vue項目為容器
docker push registry.cn-hangzhou.aliyuncs.com/haimablog/haimablog:v1.0.0 # 推送容器阿里雲倉庫

登陸阿里雲docker倉庫