通过Vercel部署Flutter Web程序

通过Vercel部署Flutter Web程序
Photo by Luca Bravo / Unsplash

有很多静态页或者 Vue 项目透过 Vercel 能很快的实现自动化部署,Flutter Web 也是一样的思路,只不过目前没有官方的模板,需要自己进行一些配置。登录 Vercel 后台之后,找到你的 Flutter 项目,导入之后在项目配置那里依次填入下面的命令即可。

vercel_flutter_config.png
  • Build command: flutter/bin/flutter build web --release
  • Output directory: build/web
  • Install command: if cd flutter; then git pull && cd .. ; else git clone https://github.com/flutter/flutter.git ; fi && ls && flutter/bin/flutter doctor && flutter/bin/flutter clean && flutter/bin/flutter config --enable-web

我又尝试了一下 cloudflare page,也是基本相同的配置方式。

cloudflare_flutter_config.png
  • Build command: if cd flutter; then git pull && cd .. ; else git clone https://github.com/flutter/flutter.git ; fi && ls && flutter/bin/flutter doctor && flutter/bin/flutter clean && flutter/bin/flutter config --enable-web; flutter/bin/flutter build web --release
  • Build output directory: /build/web
  • Root directory: /
  • On open pull requests 根据自己需求决定开关

之后便只需要写代码 push 即可。