美文网首页
Flutter web通过Cloud Build、Cloud R

Flutter web通过Cloud Build、Cloud R

作者: 这个熊孩子不太冷 | 来源:发表于2023-05-09 13:48 被阅读0次

    最近在用flutter web做网页开发,代码托管在Github上通过Cloud Build、Cloud Run实现CI/CD。记录下为了以后复盘。

    主要实现功能

    Cloud Build关联Github代码仓库,监听仓库动作触发CI/CD。

    备注:这里不记录Load Balance及DNS相关操作及GCP上的相关配置,可以参阅官方文档完成。

    cloudbuild.yaml文件:

    steps:
      - name: gcr.io/cloud-builders/docker
        args:
          - build
          - '--no-cache'
          - '-t'
          - >-
            $_AR_HOSTNAME/$PROJECT_ID/cloud-run-source-deploy/$REPO_NAME/$_SERVICE_NAME:$COMMIT_SHA
          - .
          - '-f'
          - Dockerfile
        id: Build
      - name: gcr.io/cloud-builders/docker
        args:
          - push
          - >-
            $_AR_HOSTNAME/$PROJECT_ID/cloud-run-source-deploy/$REPO_NAME/$_SERVICE_NAME:$COMMIT_SHA
        id: Push
      - name: 'gcr.io/google.com/cloudsdktool/cloud-sdk'
        args:
          - run
          - services
          - update
          - $_SERVICE_NAME
          - '--platform=managed'
          - >-
            --image=$_AR_HOSTNAME/$PROJECT_ID/cloud-run-source-deploy/$REPO_NAME/$_SERVICE_NAME:$COMMIT_SHA
          - >-
            --labels=managed-by=gcp-cloud-build-deploy-cloud-run,commit-sha=$COMMIT_SHA,gcb-build-id=$BUILD_ID,gcb-trigger-id=$_TRIGGER_ID
          - '--region=$_DEPLOY_REGION'
          - '--quiet'
        id: Deploy
        entrypoint: gcloud
    images:
      - >-
        $_AR_HOSTNAME/$PROJECT_ID/cloud-run-source-deploy/$REPO_NAME/$_SERVICE_NAME:$COMMIT_SHA
    options:
      substitutionOption: ALLOW_LOOSE
      logging: CLOUD_LOGGING_ONLY
    substitutions:
      _SERVICE_NAME: test-flutter-web-dev
      REPO_NAME: testflutterwebgithubactions
      _DEPLOY_REGION: us-central1
      _AR_HOSTNAME: us-central1-docker.pkg.dev
      _PLATFORM: managed
      _TRIGGER_ID: 99c735fb-f560-46b8-8ec7-f3ccc0327f63
    tags:
      - gcp-cloud-build-deploy-cloud-run
      - gcp-cloud-build-deploy-cloud-run-managed
      - test-flutter-web-dev 
    

    Dockerfile

    # 使用 Flutter 镜像
    FROM cirrusci/flutter AS builder
    
    # 设置工作目录
    WORKDIR /app
    
    # 复制 Flutter 应用程序源代码
    COPY . /app
    
    # 获取依赖并构建应用程序
    RUN flutter pub get && \
        flutter build web --dart-define=MODE=debug --base-href="/" --web-renderer html
    
    # 创建生产用映像
    FROM nginx
    COPY --from=builder /app/build/web/ /usr/share/nginx/html/
    # 用本地的 nginx.conf 配置来替换nginx镜像里的默认配置
    COPY nginx.conf /etc/nginx/nginx.conf
    
    

    注意:Dockerfile文件,我是用自己的nginx.conf文件替换了镜像nginx里的默认配置,端口设置8080

    相关文章

      网友评论

          本文标题:Flutter web通过Cloud Build、Cloud R

          本文链接:https://www.haomeiwen.com/subject/msnrjdtx.html