I've just created a flutter web application and now I am ready to deploy it. Looking at the docs it looks like I need to use Firebase Hosting? But I want to host the app on my own server. I tried copying the web directory from Build but when I go to the path I get a blank screen on web. How do I deploy it correctly? Or is it just simply not possible without Firebase?
First you need to compile the application.
In a terminal, command prompt or Powershell, go to the root directory of your project.
From there run a build:
flutter build web
This will create a new directory inside your project.
c:\your-project-folder\build\web
Copy everything that is in the web folder to wherever you want to publish / host your application.
Your application is bundled up into a main.dart.js file.
An index.html is also in that directory. You should be able to run your Flutter web app by visiting that index.html.
All the instructions for building a Flutter application for web platform is here.
Related
I was trying out flutter web and I wanted to share what I built with my friend so I wanted to know how to make my flutter web app open and run in browser just like html file where you would just click the file and open it with chrome and the site loads up
You cant open a flutter web project directly.
This is because flutter build web, will produce a Single Page App or SPA that will not work unless it's hosted via a server.
The user will either have to run a local server in-order to view the pages and for that you can use python 3's http.serve command or the dart variant dhttpd, the option is you can use a hosting solution like firebase or netlify to host your application if a local server is not possible.
I have added flutter web support in my existing flutter application. Successfully run in chrome browser using flutter run -d chrome. Then i have created a build for a web using flutter build web. How can i deploy or host this build to the URL for testing in any other browser.
My build we folder is looking like this...
I have developed a web app using Flutter in Android Studio IDE, and have enabled Flutter Web from the Flutter console. In Android Studio, I am able to run the app and use Chrome(web) as my target device; and the app runs well.
Can anyone advice what is the next step to export this to a web hosting service? Like PorkBun. Any help is appreciated, thanks!
Run this command in the terminal:
flutter build web
It will compile your project for the web, then you should see a generated files under [your_project]/build/web
Upload the contents of the web folder to the root folder of your hosting service. The main page index.html should run your app.
(I did a presentation last night and had this question asked. Couldn't find it on SO so I thought I'd ask and answer it myself to help others out).
When running my flutter project, it is demanding an emulator be available but I want it to run in a browser. I noticed that there's an android folder and an ios folder but no web folder. How do I get it to run on the web?
You were on the wrong channel when you created the project. Flutter has multiple channels. To fix it, you'll go to the 'master' channel and add the web components.
Run these commands in your project folder:
$ flutter channel master
$ flutter config --enable-web
$ flutter create .
Don't worry; it doesn't clobber or remove anything when you flutter create .. It just adds the web capability. Now when you run, it'll recognize a browser as a valid environment.
I'm working on a Flutter web app and would like to add some web-specific PWA resources such as icons, manifest file, service worker,...
I've tried to put these files in the /web folder but they're not copied into build/web/ when performing a release build with flutter build web.
What is the right approach to deploy these resources?
This seems to be fixed in the latest versions of Flutter (1.20.0). Previously I had setup a script that did this copy manually, but it's not required anylonger.