[Flutter Web] shows blank page, no errors in chrome console and flutter console

I am new to flutter web. I am using the default counter program. But, I get blank page in chrome and there are no errors in chrome console and flutter console.

Logs

flutter run -d chrome:

Launching lib\main.dart on Chrome in debug mode...
Syncing files to device Chrome...
16,903ms (!)

### flutter run -d chrome -v
[ +219 ms] executing: [E:\Softwares\flutter/] git -c log.showSignature=false log -n 1 --pretty=format:%H
[ +147 ms] Exit code 0 from: git -c log.showSignature=false log -n 1 --pretty=format:%H
[   +1 ms] ce55e42f2b6d1f174a4e6326bb19d4af971301be
[   +1 ms] executing: [E:\Softwares\flutter/] git tag --contains HEAD
[ +312 ms] Exit code 0 from: git tag --contains HEAD
[   +3 ms] executing: [E:\Softwares\flutter/] git describe --match *.*.*-*.*.pre --first-parent --long --tags
[  +98 ms] Exit code 0 from: git describe --match *.*.*-*.*.pre --first-parent --long --tags
[   +1 ms] 1.20.0-7.0.pre-80-gce55e42f2
[  +13 ms] executing: [E:\Softwares\flutter/] git rev-parse --abbrev-ref --symbolic @{u}
[ +115 ms] Exit code 0 from: git rev-parse --abbrev-ref --symbolic @{u}
[   +1 ms] origin/master
[   +1 ms] executing: [E:\Softwares\flutter/] git ls-remote --get-url origin
[  +81 ms] Exit code 0 from: git ls-remote --get-url origin
[   +1 ms] https://github.com/flutter/flutter.git
[ +490 ms] executing: [E:\Softwares\flutter/] git rev-parse --abbrev-ref HEAD
[  +84 ms] Exit code 0 from: git rev-parse --abbrev-ref HEAD
[   +1 ms] master
[ +118 ms] Artifact Instance of 'AndroidMavenArtifacts' is not required, skipping update.
[   +1 ms] Artifact Instance of 'AndroidGenSnapshotArtifacts' is not required, skipping update.
[        ] Artifact Instance of 'AndroidInternalBuildArtifacts' is not required, skipping update.
[   +1 ms] Artifact Instance of 'IOSEngineArtifacts' is not required, skipping update.
[        ] Artifact Instance of 'FlutterWebSdk' is not required, skipping update.
[   +7 ms] Artifact Instance of 'WindowsEngineArtifacts' is not required, skipping update.
[  +27 ms] Artifact Instance of 'MacOSEngineArtifacts' is not required, skipping update.
[   +1 ms] Artifact Instance of 'LinuxEngineArtifacts' is not required, skipping update.
[        ] Artifact Instance of 'LinuxFuchsiaSDKArtifacts' is not required, skipping update.
[  +31 ms] Artifact Instance of 'MacOSFuchsiaSDKArtifacts' is not required, skipping update.
[        ] Artifact Instance of 'FlutterRunnerSDKArtifacts' is not required, skipping update.
[        ] Artifact Instance of 'FlutterRunnerDebugSymbols' is not required, skipping update.
[  +48 ms] executing: E:\Softwares\sdk\platform-tools\adb.exe devices -l
[ +149 ms] List of devices attached
[  +11 ms] Artifact Instance of 'AndroidMavenArtifacts' is not required, skipping update.
[   +9 ms] Artifact Instance of 'AndroidGenSnapshotArtifacts' is not required, skipping update.
[   +2 ms] Artifact Instance of 'AndroidInternalBuildArtifacts' is not required, skipping update.
[  +22 ms] Artifact Instance of 'IOSEngineArtifacts' is not required, skipping update.
[   +5 ms] Artifact Instance of 'WindowsEngineArtifacts' is not required, skipping update.
[        ] Artifact Instance of 'MacOSEngineArtifacts' is not required, skipping update.
[        ] Artifact Instance of 'LinuxEngineArtifacts' is not required, skipping update.
[        ] Artifact Instance of 'LinuxFuchsiaSDKArtifacts' is not required, skipping update.
[        ] Artifact Instance of 'MacOSFuchsiaSDKArtifacts' is not required, skipping update.
[        ] Artifact Instance of 'FlutterRunnerSDKArtifacts' is not required, skipping update.
[        ] Artifact Instance of 'FlutterRunnerDebugSymbols' is not required, skipping update.
[+2018 ms] Generating E:\Personal_Project\attempt\android\app\src\main\java\io\flutter\plugins\GeneratedPluginRegistrant.java
[ +208 ms] Launching lib\main.dart on Chrome in debug mode...
[ +222 ms] Updating assets
[+4835 ms] Syncing files to device Chrome...
[ +152 ms] Generating E:\Personal_Project\attempt\android\app\src\main\java\io\flutter\plugins\GeneratedPluginRegistrant.java
[  +99 ms] <- reset
[  +12 ms] E:\Softwares\flutter\bin\cache\dart-sdk\bin\dart.exe --disable-dart-dev
E:\Softwares\flutter\bin\cache\artifacts\engine\windows-x64\frontend_server.dart.snapshot --sdk-root E:\Softwares\flutter\bin\cache\flutter_web_sdk/   
--incremental --target=dartdevc --debugger-module-names --experimental-emit-debug-metadata -Ddart.developer.causal_async_stacks=true --output-dill     
C:\Users\Arjun\AppData\Local\Temp\flutter_tools.291f60d8\flutter_tool.8885aaa0\app.dill --libraries-spec
file:///E:/Softwares/flutter/bin/cache/flutter_web_sdk/libraries.json --packages .packages -Ddart.vm.profile=false -Ddart.vm.product=false
--bytecode-options=source-positions,local-var-info,debugger-stops,instance-field-initializers,keep-unreachable-code,avoid-closure-call-instructions    
--enable-asserts --track-widget-creation --filesystem-root C:\Users\Arjun\AppData\Local\Temp\flutter_tools.291f60d8\flutter_tools.945f70a3
--filesystem-scheme org-dartlang-app --initialize-from-dill build\cache.dill.track.dill --platform
file:///E:/Softwares/flutter/bin/cache/flutter_web_sdk/kernel/flutter_ddc_sdk.dill
[  +58 ms] <- compile org-dartlang-app:/web_entrypoint.dart
[+31558 ms] Syncing files to device Chrome... (completed in 31,867ms, longer than expected)
[   +1 ms] Synced 23.7MB.
[   +1 ms] <- accept
[   +1 ms] Caching compiled dill
[+4734 ms] [CHROME]:
[   +2 ms] [CHROME]:DevTools listening on ws://127.0.0.1:57598/devtools/browser/5f326541-6e8b-445d-91e2-31c872b346f2

flutter doctor -v

[√] Flutter (Channel master, 1.20.0-8.0.pre.80, on Microsoft Windows [Version 10.0.18362.900], locale en-IN)
    • Flutter version 1.20.0-8.0.pre.80 at E:\Softwares\flutter
    • Framework revision ce55e42f2b (5 hours ago), 2020-07-14 07:40:29 -0400
    • Engine revision 1e23309a38
    • Dart version 2.9.0 (build 2.9.0-21.0.dev f997d62a6d)

 
[√] Android toolchain - develop for Android devices (Android SDK version 30.0.1)
    • Android SDK at E:\Softwares\sdk
    • Platform android-30, build-tools 30.0.1
    • ANDROID_HOME = E:\Softwares\sdk
    • Java binary at: E:\Softwares\Android\jre\bin\java
    • Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b01)
    • All Android licenses accepted.

[√] Chrome - develop for the web
    • Chrome at C:\Program Files (x86)\Google\Chrome\Application\chrome.exe

[√] Android Studio (version 4.0)
    • Android Studio at E:\Softwares\Android
    • Flutter plugin version 47.1.2
    • Dart plugin version 193.7361
    • Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b01)

[√] Connected device (3 available)
    • Web Server (web)  • web-server • web-javascript • Flutter Tools
    • Chrome (web)      • chrome     • web-javascript • Google Chrome 83.0.4103.116
    • Edge (web)        • edge       • web-javascript • Microsoft Edge 83.0.478.61

Please see the issue and reply ASAP.....

@Arjun3010

Hi @Arjun3010
Can you execute flutter run -d Chome and then blank window launches, go to top menu -> more tools -> Developer Tools or Control + Shift + I and take screenshot of console tab. It might have some error

Just tested on latest master, no issues

flutter doctor -v

[✓] Flutter (Channel master, 1.20.0-8.0.pre.102, on Linux, locale en_US.UTF-8)
    • Flutter version 1.20.0-8.0.pre.102 at /home/taha/Code/flutter_master
    • Framework revision f95f46e910 (4 hours ago), 2020-07-15 01:46:01 -0400
    • Engine revision be7595bafb
    • Dart version 2.9.0 (build 2.9.0-21.0.dev 20bf2fcf56)

[✓] Android toolchain - develop for Android devices (Android SDK version 30.0.1)
    • Android SDK at /home/taha/Code/sdk
    • Platform android-30, build-tools 30.0.1
    • ANDROID_HOME = /home/taha/Code/sdk
    • Java binary at: /home/taha/Code/android-studio/jre/bin/java
    • Java version OpenJDK Runtime Environment (build
      1.8.0_242-release-1644-b3-6222593)
    • All Android licenses accepted.

[✓] Chrome - develop for the web
    • Chrome at google-chrome

[✓] Linux toolchain - develop for Linux desktop
    • clang version 10.0.0-4ubuntu1
    • cmake version 3.16.3
    • ninja version 1.10.0
    • pkg-config version 0.29.1

[✓] Android Studio (version 4.0)
    • Android Studio at /home/taha/Code/android-studio
    • Flutter plugin version 47.1.2
    • Dart plugin version 193.7361
    • Java version OpenJDK Runtime Environment (build
      1.8.0_242-release-1644-b3-6222593)

[✓] VS Code (version 1.47.1)
    • VS Code at /usr/share/code
    • Flutter extension version 3.12.2

[✓] Connected device (3 available)
    • Linux (desktop)  • linux      • linux-x64      • Linux
    • Web Server (web) • web-server • web-javascript • Flutter Tools
    • Chrome (web)     • chrome     • web-javascript • Google Chrome
      84.0.4147.89

• No issues found!

Thank you

Check it out

Used the master branch and also tried in other branches...

I'm unable to reproduce this on 5e1635b. I created a brand new app using flutter create and ran it using flutter run -d chrome -v.

Is there anything else you can tell us about your local setup?

I'm using Windows 10 and I've got this.
Trying to switch to channel beta and dev but no luck.
With the MacOS, everything is just fine.

In my local setup, android sdk and flutter is in E: drive.

I tried the other approaches as well. In the end the solution was to reload the page after the event app.started was logged in the debug console. Since the issue only occurs in the debug mode it is ok for now, especially since hot reload is not affected. However the problem was present in all channels.

Having this issue on Mac as well. Flutter doc says:

Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.10.5, on macOS 13.3 22E252 darwin-x64, locale de-DE)
[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.1)
[✓] Xcode - develop for iOS and macOS (Xcode 14.3.1)
[✓] Chrome - develop for the web
[✓] Android Studio (version 2021.2)
[✓] IntelliJ IDEA Ultimate Edition (version 2023.1.3)
[✓] Connected device (2 available)
[✓] Network resources

• No issues found!

Hey, I had this problem for the longest time. When you start a Flutter web app make sure you're connected to the internet on your PC.
Hope it helps, helped me ;)

currently having this issue while trying to deploy on firebase, i even created a new project using flutter create test , then did the firebase init process.

removing the href in the index.html did not solve it for me, any update on this matter ???

I have the same problem. Debian 10.

For those of you experiencing this issue please share your firebase.json. Mine looks like this:

{
  "hosting": {
    "public": "web",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "rewrites": [
      {
        "source": "**",
        "destination": "/index.html"
      }
    ]
  }
}

I noticed that this happens if you answer 'y' to this question asked during 'firebase init hosting', which removes the "rewrites" field:

> Configure as a single-page app (rewrite all urls to /index.html)? y

Finally, I figured out I needed to point out the hostname and port to make the flutter web run locally.

flutter run -d chrome --web-port=8080 --web-hostname=127.0.0.1

For everyone who is still looking for workaround as I was because none of the above was working:

$ flutter run -d chrome \
  --web-port=5000 \
  --web-browser-flag="--new-window" \
  --web-browser-flag="--user-data-dir=/tmp/chrome_test2" \
  --web-browser-flag="--enable-unsafe-swiftshader" \
  --web-browser-flag="--disable-software-rasterizer" \
  --web-browser-flag="--enable-gpu-rasterization" \
  --web-browser-flag="--enable-hardware-overlays"

By default chrome was using software rendering causing problems with flutter web. The flags above enforce hardware acceleration.

Navigation Menu

Repository navigation

[Flutter Web] shows blank page, no errors in chrome console and flutter console #61464

Logs

flutter run -d chrome:

flutter doctor -v

82 remaining items

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

[Flutter Web] shows blank page, no errors in chrome console and flutter console #61464

Description

Logs

flutter run -d chrome:

flutter doctor -v

Activity

TahaTesser commented on Jul 15, 2020

Arjun3010 commented on Jul 15, 2020

Arjun3010 commented on Jul 15, 2020

yjbanov commented on Jul 15, 2020

namnh06 commented on Jul 16, 2020

Arjun3010 commented on Jul 16, 2020

82 remaining items

MelonPie commented on May 10, 2023

sittingbool commented on Jun 27, 2023

abcdOfficialzw commented on Jun 28, 2023

an99990 commented on Jul 28, 2023

blob84 commented on Sep 5, 2023

yongrim commented on Aug 17, 2024

AresVampire commented on Nov 4, 2024

derlarsschneider commented on Jul 28, 2025

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions