Flutter 安装简化教程

总体步骤

• 安装 Flutter SDK
• Android 开发环境的配置
• iOS 环境的配置
• 查看是否需要安装任何依赖项来完成设置
• 创建一个 Flutter 项目

一、安装 Flutter SDK

• 1.1、下载相应系统的 sdk，在此我选择的是 Mac系统

1.2、下载完 Flutter SDK 后，解压下载包(解压后是一个flutter 文件),把 flutter 文件 拖入到 /Applications 下

1.3、终端进行配置 flutter

终端输入： open ~/，为了看到 .bash_profile 文件，可以同时按： cmd + shift + .,复制一份 .bash_profile 文件 到桌面，把下面的内容复制到文件下面，替换掉原来的文件，完成后记得再按下 cmd + shift + . 让   . 文件隐藏起来

export FLUTTER_HOME=/Applications/flutter
export PATH=$FLUTTER_HOME/bin:$PATH
export PATH=$FLUTTER_HOME/bin/cache/dart-sdk/bin:$PATH
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

• 1.4、测试flutter 是否安装成功： 终端运行：flutter --help，出现下面的效果，表明安装成功

提示：如果报错 zsh: command not found: flutter

• 据官方说，从 macOS Catalina 版开始，您的 Mac 将使用 zsh 作为默认登录 Shell 和交互式 Shell。您还可以在较低版本的 macOS 中将 zsh 设置为默认 Shell。运行chsh -s /bin/zsh之后，发现flutter的命令不能用了，这是因为切换了shell执行工具
• 解决方法：复制一份.bash_profile，然后改名为.zprofile，终端执行source ~./zprofile

source ~/.zprofile

二、Android 开发环境的配置

• 2.1、下载 android studio,下载完安装到电脑即可，个人建议在社区进行 Android Studio 下载，因为在官网下载的我安装的时候遇到很多奇奇怪怪的事情，最后再社区下载的就没有任何问题

安装的过程可能会报错: 最好配置下

2.2.在 Android Studio 里面安装 Flutter 和 dart, 在Android Studio 的设置(commond+,快速打开Android Studio的设置界面)里面，选择 Plugins,搜索 flutter

2.3、安装好后再打开 Android Studio 如下

三、iOS 环境的配置

• 3.1、在 App Store 下载一个 Xcode 即可

• 3.2、查看项目运行直接在 Xcode 的模拟器上即可

四、查看是否需要安装任何依赖项来完成设置

• 4.1、在终端输入

flutter doctor

提示：有报红的一个一个的解决，没有请忽略

• 问题一：  Android license status unknown.

解决办法： 打开上面的 链接，如下：偏好设置->Android SDK->SDK Tools -> 取消选中 Hide Obsolete Packages -> 选中 AndroidSDKTools(Obsolete)

都没问题的如下：

五、创建一个 Flutter 项目

• 5.1、使用 Android Studio 创建一个项目

提示：推荐使用终端创建项目： flutter create 项目的名字

• Flutter Application：我们要创建的应用
• Flutter Plugin  插件： 做一些iOS或者Android原生的支持
• Flutter Package 包：是一些lip库
• Flutter Module： 组件

• 5.2、使用模拟器展示 Hello World ,复制官网给的代码到main.dart

import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
    return MaterialApp(
       title: 'Welcome to Flutter',
       home: Scaffold(
          appBar: AppBar(
             title: Text('Welcome to Flutter'),
          ),
          body: Center(
             child: Text('Hello World'),
         ),
       ),
    );
  }
}

在安装的过程中，你可能会遇到很多的问题，解决不了的都可以联系我，方式你总会找到的😆