Flutter ilk yapılandırıldığında web desteği pasiftir. Projemizi android, ios gibi web olarak da build edebilmek için web desteği enable olmalıdır.

Aradaki farkı söyle anlatalım. İlk flutter projemizi oluşturmak için

flutter create myapp

Komutundan sonra oluşan proje içerisinde web klasörü görüntülenmez ve de görüntüleme cihazları arasında Google Chrome seçeneği yoktur.

Yukarıdaki resimde görünen klasör listesinde web klasörü görülmemektedir. Aynı zamanda yer alan görüntüleme listesinde Google Chrome seçeneği bulunmamaktadır.

Web desteğinin önemli bir avantajı da bilgisayarında bellek sorunu yaşayan ve emülatör çalıştırmakta sorun yaşayan geliştiriciler için önemli bir görüntüleme alternatifi olarak Google Chrome’un kullanılabiliyor olmasıdır.  Flutter web desteğini birkaç adımda aktifleştirebiliriz.  

1. Adım

Öncelikle Flutter Channel özelliğimiz Dev yani geliştirici olmalıdır. Bunun için aşağıdaki komutu Terminalde çalıştırıyoruz.

flutter channel dev

Artık Geliştirici kanalına geçmiş bulunmaktadyız.

2. Adım

Flutter SDK dosyalarımızı güncellemek için Terminalde

flutter upgrade

komutunu çalıştırarak SDK dosyalarımız güncelledik.

3. Adım

SDK güncellemesi tamamlandıktan sonra Web özelliğini etkinleştirmek amacıyla

flutter config -–enable-web

komutunu çalıştırıp Setting "enable-web" value to "true". sonucunu aldıktan sonra VS Code IDEmizi yeniden başlatıyoruz.

4. Adım

VS Code yeniden açıldıktan sonra Terminalde

flutter create myapp

komutunu çalıştırarak yeni uygulamamızı oluşturalım. Yeni uygulama artık Android, IOS ve Web olarak build edilebilecektir. Klasör listemize web klasörünün ve görüntüleme cihazlarına Google Chrome seçeneğinin eklendiğini göreceksiniz.

Önemli Not:

Flutter ilk yapılandırıldığında Linux Desktop, Windows Desktop ve MacOS Desktop geliştirme seçenekleri de pasiftir. Bunları da enable yapmak için Terminalde

flutter config  --enable-linux-desktop

flutter config  --enable-macos-desktop

flutter config  --enable-windows-desktop

komutları çalıştırılabilir.