Netlify Build command script to deploy a Flutter Web App

flutter-netlify-build.sh

#!/bin/sh
FLUTTER_BRANCH=`grep channel: .metadata | sed 's/  channel: //g'`
FLUTTER_REVISION=`grep revision: .metadata | sed 's/  revision: //g'`

git clone https://github.com/flutter/flutter.git
cd flutter
git checkout $FLUTTER_BRANCH
git pull origin $FLUTTER_BRANCH
git checkout $FLUTTER_REVISION
cd ..

flutter/bin/flutter config --enable-web
flutter/bin/flutter build web

netlify.toml

[build]
  command = "./flutter-netlify-build.sh"
  publish = "build/web"

I like your first approach of checking the metadata file as it reflects what I set as needed on one place.

I believe the metadata part is ok.

.metadata file:

# This file tracks properties of this Flutter project.
# Used by Flutter tool to assess capabilities and perform upgrades etc.
#
# This file should be version controlled and should not be manually edited.

version:
  revision: 682e6383aca3996644a5e5645089bbc8b6bf14c5
  channel: master

project_type: app

Thanks for tip on the logging. I will dig further into in.

@richard-flosi You were right! The issue is in the .metadata file as it was not updated reflecting the current flutter version on dev.

My apologies.

For others fighting with this.

.metadata file is not updated by flutter upgrade command.

I initially thought it reflects the current flutter version, which is not the case as it rather reflects the version of flutter at the time the project was created.

Looking around I honestly cannot find where the up to date project's flutter version is identified.

What's in your .metadata file?
Are FLUTTER_BRANCH and FLUTTER_REVISION set right?
I'm not using this methodology anymore. The idea here was to parse .metadata from flutters output. I'm using a fixed version at this point.

I'm not sure exactly what is happening for you. Also, make sure that you clear the cache and retry the build in Netlify and maybe add some logging so you know if it's using a cached version of flutter or installing it from git clone.

Can you please share your new methodology

Here is the build script I just used to launch a new flutter web site on netlify:

build.sh

#!/bin/bash

# Get flutter
git clone https://github.com/flutter/flutter.git
FLUTTER=flutter/bin/flutter

# Configure flutter
FLUTTER_CHANNEL=master
FLUTTER_VERSION=v1.17.0
$FLUTTER channel $FLUTTER_CHANNEL
$FLUTTER version $FLUTTER_VERSION
$FLUTTER config --enable-web

# Build flutter for web
$FLUTTER build web

echo "OK"

@shadowdogg

Can you please share your new methodology?

I created a new gist to demonstrate here:
https://gist.github.com/richard-flosi/766040cec9bd2ea5da7a33bc01706de4

Hi there ! I'm pretty new to Flutter Web and Netlify and was wondering if perhaps you knew any resources that could explain this process ! How-to setup netlify with build scripts !

@Gene-Dana Try Netlify: Get started with build configuration

how can i generate .g.dart files while deploying??

how can i generate .g.dart files while deploying??

I'm not sure myself, but it looks like this issue may address your question: google/json_serializable.dart#581

See comment here: google/json_serializable.dart#581 (comment)

How to fix this error: 12:18:29 PM: Exception: Failed to compile application for the Web.
12:18:29 PM: ​
12:18:29 PM: build.command failed
12:18:29 PM: ────────────────────────────────────────────────────────────────
12:18:29 PM: ​
12:18:29 PM: Error message
12:18:29 PM: Command failed with exit code 1: if cd flutter; then git pull && cd ..; else git clone https://github.com/flutter/flutter.git; fi && flutter/bin/flutter config --enable-web && flutter/bin/flutter build web --release (https://ntl.fyi/exit-code-1)
12:18:29 PM: ​
12:18:29 PM: Error location
12:18:29 PM: In Build command from Netlify app:
12:18:29 PM: if cd flutter; then git pull && cd ..; else git clone https://github.com/flutter/flutter.git; fi && flutter/bin/flutter config --enable-web && flutter/bin/flutter build web --release
12:18:29 PM: ​
12:18:29 PM: Resolved config
12:18:29 PM: build:
12:18:29 PM: command: if cd flutter; then git pull && cd ..; else git clone https://github.com/flutter/flutter.git; fi && flutter/bin/flutter config --enable-web && flutter/bin/flutter build web --release
12:18:29 PM: commandOrigin: ui
12:18:29 PM: environment:
12:18:29 PM: - REVIEW_ID
12:18:29 PM: publish: /opt/build/repo/build/web
12:18:29 PM: publishOrigin: ui
12:18:31 PM: Build failed due to a user error: Build script returned non-zero exit code: 2
12:18:31 PM: Failing build: Failed to build site
12:18:32 PM: Finished processing build request in 1m21.142s

@fisforfaheem This example is pretty old now and it looks like Netlify is reporting your build failed. I'd probably work on getting the build to work locally first and there is probably a better way to do this now. Have you read through the Flutter web docs here? https://docs.flutter.dev/platform-integration/web/building

yes did all the stuff no luck [image: Mailtrack] <https://mailtrack.io?utm_source=gmail&utm_medium=signature&utm_campaign=signaturevirality11&> Sender notified by Mailtrack <https://mailtrack.io?utm_source=gmail&utm_medium=signature&utm_campaign=signaturevirality11&> 07/02/23, 02:12:27 AM

…

On Sat, Jul 1, 2023 at 1:54 AM Richard Flosi ***@***.***> wrote: ***@***.**** commented on this gist. ------------------------------ @fisforfaheem <https://github.com/fisforfaheem> This example is pretty old now and it looks like Netlify is reporting your build failed. I'd probably work on getting the build to work locally first and there is probably a better way to do this now. Have you read through the Flutter web docs here? https://docs.flutter.dev/platform-integration/web/building — Reply to this email directly, view it on GitHub <https://gist.github.com/richard-flosi/8b43c06732d296f1145b8f5d12bf194e#gistcomment-4615611> or unsubscribe <https://github.com/notifications/unsubscribe-auth/AIRXJSDOUBBHL4TID3PJWALXN44HJBFKMF2HI4TJMJ2XIZLTSKBKK5TBNR2WLJDHNFZXJJDOMFWWLK3UNBZGKYLEL52HS4DFQKSXMYLMOVS2I5DSOVS2I3TBNVS3W5DIOJSWCZC7OBQXE5DJMNUXAYLOORPWCY3UNF3GS5DZVRZXKYTKMVRXIX3UPFYGLK2HNFZXIQ3PNVWWK3TUUZ2G64DJMNZZDAVEOR4XAZNEM5UXG5FFOZQWY5LFVEYTAMBQHA2TGMRXU52HE2LHM5SXFJTDOJSWC5DF> . You are receiving this email because you were mentioned. Triage notifications on the go with GitHub Mobile for iOS <https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675> or Android <https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub> .

i tried