Proyecto Flutter en VSCode

Tiempo de lectura: 4 minutos

Hoy os voy a enseñar cómo abrir un proyecto Flutter en VSCode para trabajar en este entorno.

Primero vamos a instalar Flutter SDK en nuestro PC:

  • Después se descomprime la carpeta flutter en el directorío dónde queramos instalarla (en mi caso C:/flutter):
  • Una vez descomprimida, indicamos hay que crear una variable de entorno para que nos deje ejecutar flutter desde el terminal. Para ello vamos a la barra de búsqueda de inicio y escribimos env.
  • Abrimos Editar las variables de entorno del sistema.
  • Pulsamos en Variables de entorno…
  • Buscamos o la variable Path, si no existe le damos a Nueva… y la creamos.
  • En mi caso existe, ya que tiene añadido el directorio de Java:
  • Si existe la editamos y le damos a Nuevo:
  • Ahora añadimos la ruta de \flutter\bin en mi caso es C:\flutter\bin
  • Pulsamos en Aceptar en todas las ventanas.
  • Ahora abrimos CMD o consola de Windows y probamos que funcione escribiendo flutter doctor.
flutter doctor

Y si funciona aparecerá esto:

Comprobamos si hay algun error y ejecutamos lo que indica:

En mi caso tengo que instalar esto «path/to/sdkmanager –install «cmdline-tools;latest» para ejecutarlo tenemos que buscar la ruta de sdk de Android, si no la tenemos tendremos que instalar el SDK de Android (https://developer.android.com/studio)

En mi caso la ruta es: C:\Users\ismae\AppData\Local\Android\Sdk\tools\bin\sdkmanager.bat . Para encontrar la ruta es: C:\Users\{nombre_usuario}\AppData\Local\Android\Sdk\tools\bin\sdkmanager.bat

Ejecutamos el comando:

C:\Users\ismae\AppData\Local\Android\Sdk\tools\bin\sdkmanager.bat --install "cmdline-tools;latest"

Si no funciona esta opción, también podemos hacer lo siguiente.

  • Abrimos Android Studio y vamos a Tools – SDK Manager – SDK Tools – Android SDK Command-line Tools – Install

Abrimos SDK Tools

E instalamos Command line Tools

Pulsamos en Apply

Una vez instalado, pulsamos en Finish y en Ok

Ahora volvemos a ejecutar Flutter Doctor para ver si devuelve algún error.

flutter doctor

En mi caso me devuelve que la licencia de Android no está aceptada «! Some Android licenses not accepted. To resolve this, run: flutter doctor –android-licenses»

Ejecutamos esto:

flutter doctor --android-licenses

Aceptamos las licencias y listo.

Volvemos a ejecutar Flutter doctor para comprobar si hay algún error:

flutter doctor

Ahora ya podemos ejecutar los comandos de flutter:

  • Para probar el proyecto: flutter run
flutter run

Si no tenemos un dispositivo enchufado con depuración USB (https://devcodelight.com/habilitar-depuracion-usb-opciones-para-desarrollador-en-tu-dispositivo-android/) nos aparece si queremos ejecutarlo en web:

Y si trenemos el dispositivo, comenzará a ejecutarlo en él:

Tarda bastante, tenemos que tener paciencia mientras se copila.

Otros comandos útiles:

  • flutter upgrade (actualiza flutter)

También podremos ejecutar comandos desde la paleta de comandos de VS Code

Si escribimos Flutter aparecerán los siguientes:

Deja un comentario