Skip to content

Flutter Install Guide

Simran Paul edited this page Sep 24, 2019 · 1 revision

Flutter Install Guide

  • Flutter is a new framework by Google that lets developers build cross-platform mobile apps with a single codebase written in Dart.

  • Please follow the guide below to install the requisite software. Instructions are available for Windows, Ubuntu and MacOS.

  • If you face any issues

    • Read the Frequent Installtion Issues at the end of this guide.

    • Please reach out to us and we will help you get up and running with software. You can also directly come for the event and we will help you troubleshoot the installation there.

SOFTWARE CHECKLIST :

  1. Git
  2. Flutter SDK
  3. Android Studio with the Android SDK
  4. VSCode (Optional)

INSTALLATIONS :

Here’s a comprehensive guide to installing Flutter and Android Studios onto your system.

Windows

  1. Make sure you have git installed in your systems. If not, follow the guide: https://www.atlassian.com/git/tutorials/install-git with the Use Git from Command Prompt option.

  2. Open the Flutter SDK Archive ( https://flutter.io/sdk-archive/ ) and download the latest Flutter SDK- v1.0.0 and extract the folder in C: drive.

  3. To set the Path, perform the following steps:
    a. Navigate in to Flutter SDK folder (in our case C:\Flutter)
    b. Go inside to bin folder and copy the directory path (in your case C:\Flutter\bin)
    c. Go to “Control Panel > User Accounts > User Accounts > Change my environment variables” . Under “User variables” select path variable and click edit.
    d.In new dialog box click on New button, pasted the path to your Flutter bin folder. Then click OK. (Move up the flutter path to the top, using the "Move Up" option on the right).
    Flutter Path e. In new dialog box click on New button, pasted the path to your Flutter bin folder. Then click OK. (Move up the flutter path to the top, using the "Move Up" option on the right). Flutter Path

  4. Moving on to Android Studio- download and install it from https://developer.android.com/studio and prepare yourself for a somewhat long wait. Once it is installed, go through the ‘Android Studio Setup Wizard’. This installs the latest Android SDK, Android SDK Platform-Tools, and Android SDK Build-Tools, which are required by Flutter when developing for Android. Also, install Google USB Driver as we are going to use our phones to run the apps we create.
    Installing Android SDK

  5. We recommend using an editor like VSCode, a lightweight editor with flutter support, which you can download and add on the Flutter plugin. (https://code.visualstudio.com/)
    a. Start VS Code.
    b. Invoke View > Command Palette….
    c. Type “install”, and select Extensions: Install Extensions.
    d. Type “flutter” in the extensions search field, select Flutter in the list, and click Install. This also installs the required Dart plugin.
    e. Click Reload to Activate to reload VS Code.

  6. The last Step would be to open up your console terminal (command prompt) and execute the command - flutter doctor which checks your environment and displays a report of the status of your Flutter installation. It will also point out any issues that need resolving.
    7.Open up a new flutter project which has a demo app that’s pre-written. Run the app to get a feel of how flutter works. Flutter Doctor

Linux

  1. Make sure you have git installed in your systems. If not, follow the guide: https://www.atlassian.com/git/tutorials/install-git

  2. Download the latest stable version of the Flutter SDK (v1.0.0) from the Flutter SDK Archive ( https://flutter.io/sdk-archive/#linux ).

  3. Extract the Flutter SDK. Navigate to the location of TAR file and run the following command.$ tar xf flutter_linux_v0.3.2-beta.tar.xz

  4. Add flutter/bin to PATH. To append complete path of flutter/bin to PATH variable, open .bash_profile file in edit mode and add the following line at the end of the file. [PATH_TO_FLUTTER_SDK_DIRECTORY] =
    a.Get the complete path to flutter sdk directory. This value changes based on where you extracted the SDK. Right click and open a terminal from the window where you extracted flutter. You can get the whole path by running pwd command in that terminal.
    b.For UBUNTU, add the complete path of [PATH_TO_FLUTTER_SDK_DIRECTORY]/flutter/bin to PATH in .bashrc file. Run the following command to open .bashrc file in edit mode. [You may also use vi or any other editor]. ~$ sudo nano ~ /.bashrc
    c.Add the following line at the end of the file and save.export PATH="[PATH_TO_FLUTTER_SDK_DIRECTORY]/flutter/bin:$PATH".For Example : export PATH= "downloads/flutter/flutter/bin:$PATH"
    d.Restart the terminal and run following command.~$ echo $PATH The path to the flutter SDK bin folder should be echoed, along with the previous PATH value.

  5. Flutter SDK Setup is complete.

  6. Moving on to Android Studio- download and install it from https://developer.android.com/studio and prepare yourself for a somewhat long wait. Once it is installed, go through the ‘Android Studio Setup Wizard’. This installs the latest Android SDK, Android SDK Platform-Tools, and Android SDK Build-Tools, which are required by Flutter when developing for Android.

  7. We recommend using an editor like VSCode, a lightweight editor with flutter support, which you can download and add on the Flutter plugin. (https://code.visualstudio.com/)
    a. Start VS Code.
    b. Invoke View > Command Palette….
    c. Type “install”, and select Extensions: Install Extensions.
    d. Type “flutter” in the extensions search field, select Flutter in the list, and click Install. This also installs the required Dart plugin.
    e. Click Reload to Activate to reload VS Code.

  8. The last Step would be to open up your console terminal (command prompt) and execute the command - flutter doctor which checks your environment and displays a report of the status of your Flutter installation. It will also point out any issues that need resolving.

  9. Open up a new flutter project which has a demo app that’s pre-written. Run the app to get a feel of how flutter works. Flutter Doctor

MacOS

  1. Make sure you have git installed in your systems. If not, follow the guide: https://www.atlassian.com/git/tutorials/install-git
  2. Download the latest stable version of the Flutter SDK (v1.0.0) from the Flutter SDK Archive ( https://flutter.io/sdk-archive).
  3. Extract the file in the desired location, for example:
    cd ~/development
    $ unzip ~/Downloads/flutter_macos_v1.0.0-stable.zip
  4. Set the Path using the following steps :
    a. Determine the directory where you placed the Flutter SDK. You will need this in Step3.
    b. Open (or create) $HOME/.bash_profile. The file path and filename might be different on your machine.
    c. Add the following line and change [PATH_TO_FLUTTER_GIT_DIRECTORY] to be the path where you cloned Flutter’s git repo:
    $ export PATH="$PATH:[PATH_TO_FLUTTER_GIT_DIRECTORY]/flutter/bin"
    d. Run source $HOME/.bash_profile to refresh the current window.
    e. Verify that the flutter/bin directory is now in your PATH by running:
    $ echo $PATH
  5. Moving on to Android Studio- download and install it from (https://developer.android.com/studio) and prepare yourself for a somewhat long wait. Once it is installed, go through the ‘Android Studio Setup Wizard’. This installs the latest Android SDK, Android SDK Platform-Tools, and Android SDK Build-Tools, which are required by Flutter when developing for Android.
  6. We recommend using an editor like VSCode, a lightweight editor with flutter support, which you can download and add on the Flutter plugin. (https://code.visualstudio.com/)
    a. Start VS Code.
    b.Invoke View > Command Palette….
    c. Type “install”, and select Extensions: Install Extensions.
    d. Type “flutter” in the extensions search field, select Flutter in the list, and click Install. This also installs the required Dart plugin.
    e. Click Reload to Activate to reload VS Code.
  7. The last Step would be to open up your console terminal (command prompt) and execute the command - flutter doctor which checks your environment and displays a report of the status of your Flutter installation. It will also point out any issues that need resolving.
  8. Open up a new flutter project which has a demo app that’s pre-written. Run the app to get a feel of how flutter works. Flutter Doctor

FREQUENT INSTALLATION ISSUES

A. If you face a problem running the flutter doctor command, like so:

  1. Make sure that the environment variables are set correctly,
    Go to “Control Panel > User Accounts > User Accounts > Change my environment variables” Under “User variables” check if there is an entry called “Path”: If the entry does exist, append the full path to flutter\bin using ; as a separator from existing values. If the entry does not exist, create a new user variable named Path with the full path to flutter\bin as its value.
  2. Reboot your computer. Once both above steps are done, run flutter doctor once again.

B. If there is an issue with Android Licenses, try these:
a. Open your terminal
b. Type flutter doctor --android-licenses
c. Press y to accept every license.

C. Android Studio Gradle Build is taking too long - Following the steps will make it 10 times faster and reduce build time 90% First create a file named gradle.properties in the following directory:

/home/<username>/.gradle/ (Linux)
/Users/<username>/.gradle/(Mac)
C:\Users\<username>\.gradle (Windows)

Add this line to the file:
org.gradle.daemon=true org.gradle.parallel=true and try running the project again.