Build a Flutter development environment

If you want to do a good job, you must first sharpen your tools. This section first introduces the installation of the Flutter SDK under Windows and macOS, and then introduces the use of the IDE and emulator.

Install Flutter

Since Flutter builds release packages for both Android and IOS platforms at the same time, Flutter relies on both the Android SDK and the iOS SDK. When installing Flutter, you also need to install the build tools and SDKs for the corresponding platforms. Let's introduce the environment construction under Windows and macOS respectively.

Note: The installation method described in this section may change with the upgrade of Flutter. If the content described below is invalid when you install Flutter, please visit the official website of Flutter and install it according to the latest installation tutorial on the official website.

1. Use mirroring

Since access to Flutter in China may sometimes be restricted, Flutter officially builds a temporary image for Chinese developers. You can add the following environment variables to the user environment variables:

Note: This mirror is a temporary mirror and cannot be guaranteed to be available all the time. Readers can refer to https://flutter.dev/community/china for the latest developments about the mirror server.

2. Build a Flutter development environment on Windows

1) System requirements

To install and run Flutter, your development environment must meet the following minimum requirements:

• OS: Windows 7 or later (64-bit)

• Disk space: 400 MB (disk space not including Android Studio).

• Tools: Flutter relies on the following command-line tools.

  • PowerShell 5.0 (opens new window) or newer version

  • Git for Windows (opens new window)  (Git command line tool);

  If you have Git for Windows installed, make sure you can run the git command in Command Prompt or PowerShell

2) Get the Flutter SDK

1. Go to flutter official website to download its latest available installation package, download address: https://flutter.dev/docs/development/tools/sdk/releases.

   Note that the channel version of Flutter will keep changing, please refer to the official website of Flutter. In addition, in mainland China, if you want to get the installation package list or download the installation package normally, you may need to go over the wall. Readers can also go to the Flutter github project to download the installation package, address: https://github.com/flutter/flutter/ releases.

2. Unzip the installation package zip to the path where you want to install the Flutter SDK (such as: C:\src\flutter; Note, do not install flutter to a path that requires some high permissions C:\Program Files\).

3. flutter Find it under the file in the Flutter installation directory flutter_console.bat, double-click to run it and start the flutter command line . Next, you can run the flutter command on the Flutter command line.

update environment variables

If you want to run flutter commands on the Windows system's own command line, you need to add the following environment variables to the user PATH:

• Go to "Control Panel > User Accounts > User Accounts > Change My Environment Variables"
• Check for an entry named "Path" under "User Variables":
  • If the entry exists, append the full path to flutter\bin, using ; as a separator.
  • If the entry does not exist, create a new user variable Path and use flutter\binthe full path of as its value.

Restart Windows to apply this change.

Run the flutter doctor command

Run the following command on the Flutter command line to see if any other dependencies need to be installed, and if so, install them:

This command checks your environment and displays a report in the command window. The Dart SDK is already packaged in the Flutter SDK, there is no need to install Dart separately. Carefully examine the command line output for additional software that may need to be installed or further tasks to be performed.

For example:

The first time you run a flutter command (like flutter doctor), it downloads it's own dependencies and compiles itself. It will be much faster to run later. The missing dependencies need to be installed, and after the installation is complete, run flutter doctorthe command to verify whether the installation is successful.

3) Android Settings

Flutter depends on the full installation of Android Studio. Android Studio can not only manage Android platform dependencies, SDK versions, etc., but it is also one of the recommended IDEs for Flutter development (of course, you can also use other editors or IDEs, which we will discuss later).

Install Android Studio

1. Download and install Android Studio, download link: https://developer.android.com/studio/index.html.
2. Start Android Studio, and execute the "Android Studio Setup Wizard". This will install the latest Android SDK, Android SDK Platform-Tools, and Android SDK Build-Tools, which are required for Android development with Flutter.

4) Have problems installing?

If you encounter problems during the installation process, you can go to the flutter official website to check whether the installation method has changed, or search for solutions on the Internet.

3. Build a Flutter development environment on macOS

Android and iOS devices can be tested simultaneously under masOS.

1) System requirements

To install and run Flutter, your development environment must meet the following minimum requirements:

• Operating system: macOS (64-bit)
• Disk space: 700 MB (not including disk space for Xcode or Android Studio).
• Tools: Flutter relies on the following command-line tools.
  • bash、mkdir、rm、git、curl、unzip、which

2) Get the Flutter SDK

1. Go to flutter official website to download its latest available installation package, official website address: https://flutter.dev/sdk-archive/#macos

Note that the channel version of Flutter will keep changing, please refer to the official website of Flutter. In addition, in mainland China, if you want to get the installation package list or download the installation package normally, you may need to go over the wall. Readers can also go to the Flutter github project to download the installation package, address: https://github.com/flutter/flutter/ releases.

2. Unzip the installation package to the directory you want to install, such as:

3. Add flutterrelated tools to path:

This code can only temporarily set the PATH environment variable for the current command line window. If you want to permanently add Flutter to the PATH, please refer to the update environment variable section below.

Run the flutter doctor command

This step is consistent with the steps under Windows, so I won’t repeat it here.

update environment variables

Add Flutter to your PATH to run fluttercommands in any terminal session.

The steps to permanently modify this variable for all terminal sessions are computer system specific. Typically you would add commands that set environment variables to the file that is executed when opening a new window. For example

1. Make sure the directory of your Flutter SDK is marked as "FLUTTER_INSTALL_PATH", which you will use in step 3.

2. Open (or create) $HOME/.bash_profile. The file path and file name may be different on your computer.

3. Add the following paths:

For example, the author's Flutter installation directory is "~/code/flutter_dir", then the code is:

1. Run source $HOME/.bash_profileto refresh the current terminal window.

Note:  If the terminal you use is zsh, it will not be loaded when the terminal starts.  ~/.bash_profile The solution is to modify  ～/.zshrc it and add: source ~/.bash_profile

2. Verify that "flutter/bin" is already in PATH:

3) Install Xcode

To develop Flutter apps for iOS, you need the latest version of Xcode:

1. Install the latest version of Xcode.
2. Configuring the Xcode Command Line Tools to Use the Newly Installed Version of Xcode This is the correct path sudo xcode-select --switch /Applications/Xcode.app/Contents/Developerfor most cases when you want to use the latest version of Xcode. If you need to use a different version, please specify the corresponding path.
3. Make sure the Xcode License Agreement is sudo xcodebuild -licenseagreed by opening Xcode once or by command.

Using Xcode, you can run Flutter apps on an iOS device or simulator.

4) Install Android Studio

Like Window, to build and run a Flutter program on an Android device, you need to install Android Studio first. Readers can download and install Android Studio first, so I won’t go into details here.

4. Upgrade Flutter

1) Flutter SDK branch

The Flutter SDK has multiple branches, such as beta, dev, master, and stable. The stable branch is a stable branch (there may be new stable branches after a new stable version is released in the future, such as 1.0.0), and the dev and master are The development branch, after installing flutter, you can run it to flutter channelview all branches. For example, after the author runs it locally, the results are as follows:

The branch with "*" is the branch tracked by your local Flutter SDK. To switch branches, you can use flutter channel beta or  flutter channel master. Flutter officially recommends tracking the stable branch, but you can also track masterthe branch so that you can view the latest changes, but this is not stable Much lower.

2) Upgrade Flutter SDK and dependent packages

To upgrade flutter sdk, just one command:

This command will update the Flutter SDK and your flutter project dependencies at the same time. If you only want to update the project dependencies (not including the Flutter SDK), you can use the following command:

• flutter packages getGet all dependencies of the project.
• flutter packages upgradeGet the latest versions of all dependencies of the project.

1.3.2 IDE configuration and use

In theory, any text editor and command-line tool can be used to build a Flutter application. However, Flutter officially recommends using one of Android Studio and VS Code for a better development experience. Flutter officially provides these two editor plug-ins. Through the IDE and the plug-in, you can obtain functions such as code completion, syntax highlighting, widget editing assistance, running and debugging support, which can help us greatly improve development efficiency. Let's introduce the configuration and use of Android Studio and VS Code respectively (readers of Android Studio and VS Code can get the latest installation on their official website, because the installation is relatively simple, so I won't go into details).

1. Android Studio configuration and use

Since Android Studio is developed based on IntelliJ IDEA, readers can also use IntelliJ IDEA.

1) Install the Flutter and Dart plugins

Two plugins need to be installed:

• FlutterPlugin: Supports Flutter development workflow (running, debugging, hot reloading, etc.).
• DartPlugin: Provides code analysis (validation when typing code, code completion, etc.).

installation steps:

1. Start Android Studio.
2. Open the Plugins preferences (macOS: Preferences>Plugins , Windows: File>Settings>Plugins ).
3. Select Browse repositories... , select the flutter plugin and click install.
4. The plugin takes effect after restarting Android Studio.