问题:如何使用 Docker 运行 Flutter Web 应用程序?

我已经使用 Flutter 实现了我的第一个(正在运行的)Web 应用程序,现在我将使用 Docker(这对我来说相当新)来部署它来运行它。

我的文件夹结构如下:${workdir}/Dockerfile、${workdir}/docker-compose.yaml和${workdir}/myprog其中后者是我的 Intellij 项目目录,因此包含pubspec.yaml-文件。后者与演示文件相同。

Dockerfile如下:

FROM ubuntu:20.04

# Prerequisites
RUN apt-get update && apt-get install -y unzip xz-utils git openssh-client curl && apt-get upgrade -y && rm -rf /var/cache/apt

# Install flutter beta
RUN curl -L https://storage.googleapis.com/flutter_infra/releases/beta/linux/flutter_linux_1.22.0-12.1.pre-beta.tar.xz | tar -C /opt -xJ

ENV PATH "$PATH:/opt/flutter/bin"

# Enable web capabilities
RUN flutter config --enable-web
RUN flutter upgrade
RUN flutter pub global activate webdev
RUN flutter doctor

# Initialize web-app
WORKDIR /opt/web

# Copy it into docker container
COPY ./myprog/ ./

docker-compose.yaml文件是

version: '3.1'
services:
  webapp:
    container_name: myprog
    restart: always
    image: myprog
    ports:
      - 5001:5001 
    build:
      context: ./
    volumes:
      - /var/run/docker.sock:/var/run/docker.sock
    command: ["flutter", "pub", "global", "run", "webdev", "serve", "0.0.0.0:5001"]

我使用docker-compose -f docker-compose.yaml build成功构建它,但使用docker-compose -f docker-compose.yaml up运行它失败并显示以下错误消息

myprog    | webdev could not run for this project.
myprog    | Could not find a file named "pubspec.yaml" in "/opt/flutter/.pub-cache/hosted/pub.dartlang.org/flutter_keyboard_visibility-3.2.2".
myprog    | pub finished with exit code 78

pubspec.yaml 的完整路径是/opt/web/pubspec.yaml。我该如何解决这个问题?

解答

我认为您忘记在 docker 文件中安装依赖包。在 Flutter 项目目录(包含 pubspec.yaml 的目录)中,您需要

RUN flutter pub get

在构建应用程序之前。

另外我认为您应该为 web.xml 运行正确的构建命令。参考指南(https://flutter.dev/docs/get-started/web)你应该

RUN flutter build web