Créer une application Web avec Flutter

Créer une application Web avec Flutter

Cette page couvre les étapes suivantes pour démarrer avec l’assistance Web :

Configurez l’outil Flutter pour le support Web.
Créez un nouveau projet avec support Web.
Exécutez un nouveau projet avec le support Web.
Créez une application avec support Web.
Ajoutez une prise en charge Web à un projet existant.

Conditions

Building a web application with Flutter
Building a web application with Flutter

Pour créer une application Flutter avec support Web, vous avez besoin du logiciel suivant :

SDK flottant. Consultez les instructions d’installation du SDK Flutter.
Chrome; le débogage d’une application Web nécessite le navigateur Chrome.
Facultatif : un IDE qui prend en charge Flutter. Vous pouvez installer Android Studio, IntelliJ IDEA ou Visual Studio Code et installer les plug-ins Flutter et Dart pour activer la prise en charge linguistique et les outils de refactorisation, d’exécution, de débogage et de rechargement de votre application Web dans un éditeur. Voir configurer un éditeur pour plus de détails.

Pour plus d’informations, consultez la FAQ Web.
Créer un nouveau projet avec support Web

Vous pouvez utiliser les étapes suivantes pour créer un nouveau projet avec support Web.
Mettre en place

Exécutez les commandes suivantes pour utiliser la dernière version du SDK Flutter :

canal de flottement stable

mise à niveau de flottement

Avertissement : L’exécution de flutter channel stable remplace votre version actuelle de Flutter par la version stable et peut prendre du temps si votre connexion est lente. Après cela, l’exécution de la mise à niveau de Flutter met à niveau votre installation vers la dernière version stable. Revenir à un autre canal (bêta ou maître) nécessite d’appeler explicitement le canal flutter <channel>.

Si Chrome est installé, la commande Flutter Devices génère un appareil Chrome qui ouvre le navigateur Chrome avec votre application en cours d’exécution, et un serveur Web qui fournit l’URL desservant l’application.

dispositifs de flottement
1 appareil connecté :

Chrome (Web) • chrome • web-javascript • Google Chrome 88.0.4324.150

Dans votre IDE, vous devriez voir Chrome (web) dans le menu déroulant de l’appareil.
Créer et exécuter

La création d’un nouveau projet avec prise en charge Web n’est pas différente de la création d’un nouveau projet Flutter pour d’autres plates-formes.
EDI

Créez une nouvelle application dans votre IDE et elle crée automatiquement les versions iOS, Android et Web de votre application. (Et macOS aussi, si vous avez activé la prise en charge du bureau.) Dans le menu déroulant de l’appareil, sélectionnez Chrome (web) et exécutez votre application pour la voir se lancer dans Chrome.
Ligne de commande

Pour créer une nouvelle application qui inclut le support Web (en plus du support mobile), exécutez les commandes suivantes, en remplaçant my_app par le nom de votre projet :

flotter créer my_app
cd mon_app

Pour diffuser votre application à partir de localhost dans Chrome, saisissez ce qui suit en haut du package :

flutter run -d chrome

flutter build web

Remarque : S’il n’y a pas d’autres appareils connectés, le -d chrome est facultatif.

La commande flutter run lance l’application à l’aide du compilateur de développement dans un navigateur Chrome.

Avertissement : le rechargement à chaud n’est pas pris en charge dans un navigateur Web Actuellement, Flutter prend en charge le redémarrage à chaud, mais pas le rechargement à chaud dans un navigateur Web.
Construire

Exécutez la commande suivante pour générer une version de version :

flutter build web

Une version de version utilise dart2js (au lieu du compilateur de développement) pour produire un seul fichier JavaScript main.dart.js. Vous pouvez créer une version de version en utilisant le mode de version (flutter run –release) ou en utilisant flutter build web. Cela remplit un répertoire build/web avec des fichiers construits, y compris un répertoire assets, qui doivent être servis ensemble.

Vous pouvez également inclure –web-renderer html ou –web-renderer canvaskit pour choisir entre les moteurs de rendu HTML ou CanvasKit, respectivement. Pour plus d’informations, voir Moteurs de rendu Web.

Pour plus d’informations, voir Créer et publier une application Web.
Ajouter une prise en charge Web à une application existante

Pour ajouter une prise en charge Web à un projet existant créé à l’aide d’une version précédente de Flutter, exécutez la commande suivante depuis le répertoire de votre projet

Un ensemble de solutions métiers, des services et de l’innovation pour optimiser votre entreprise Webblue_heart,  Solution ERP, website ecommerce, mobile developpeur  and Mobileyellow_heart,  Solution ERP, website ecommerce, mobile developpeur

,  Solution ERP, website ecommerce, mobile developpeur
,  Solution ERP, website ecommerce, mobile developpeur
,  Solution ERP, website ecommerce, mobile developpeur
,  Solution ERP, website ecommerce, mobile developpeur
,  Solution ERP, website ecommerce, mobile developpeur
,  Solution ERP, website ecommerce, mobile developpeur

 545 total views,  2 views today

3 thoughts on “Créer une application Web avec Flutter”

  1. […] pouvez exécuter Flutter Doctor pour voir s’il y a des problèmes non résolus. Vous devriez voir une coche pour […]

  2. […] pouvez utiliser toutes les applications proxy disponibles sur Android Playstore. Fondamentalement, votre appareil iOS utilisera le hostpot du téléphone Android. […]

Add a Comment

Your email address will not be published.