【Flutter】Flutter安装和配置超详细（mac）

1. 下载Flutter

• 打开网页https://flutter.dev/，首页->Get started->macOs，下载flutter镜像文件。下载完成后解压，我的解压目录是/Users/yds/Library/Android/flutter
• 在app store下载xcode，下载安装完成后，打开xcode，同意其协议。

2. 配置环境

可以去flutter中文网查看配置方法。

• 在控制台输入vm .bahs_profile编辑文件，按i进入编辑模式，将下面内容配置到.bash_profile文件中 export ANDROID_HOME=“/Users/用户名/Documents/android_sdk” //android sdk目录，替换为你自己的即可

export PATH=${PATH}:${ANDROID_HOME}/tools
export PATH=${PATH}:${ANDROID_HOME}/platform-tools
export PUB_HOSTED_URL=https://pub.flutter-io.cn //国内用户需要设置
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn //国内用户需要设置
export PATH=/Users/yds/Library/Android/flutter/bin:$PATH

• 输入完成后，按ESC键，然后在控制台输入:wq 退出并保存编辑，并刷新配置

source .bash_profile

• 在控制台输入

flutter doctor

红叉叉表示需要配置到东西

• cmdline-tools component is missing 打开android studio，preference->android sdk 勾选上图所示选项，并应用。下载完成后，再次在控制台输入flutter doctor
• Some Android licenses not accepted. To resolve this, run: flutter doctor --android-licenses 这个就比较简单了，直接在控制台输入以下内容，然后一路选y就行了

flutter doctor --android-licenses

• CocoaPods not installed. 在控制台输入以下内容，然后输入锁屏密码

sudo gem install cocoapods

• HTTP host https://maven.google.com/ is not reachable. Reason: An error occurred while checking the HTTP host: Operation timed out

打开如下目录文件

/Users/yds/Library/Android/flutter/packages/flutter_tools/gradle/flutter.gradle

里面内容如下：

修改repositories里面的内容为：

maven { url 'https://maven.aliyun.com/repository/public'}
maven { url 'https://maven.aliyun.com/repository/google'}
maven { url 'https://maven.aliyun.com/repository/jcenter'}
maven { url 'https://maven.aliyun.com/repository/central'}

配置完成后，再次运行

flutter doctor

• 打开Android Studio，下载flutter插件

安装完成后重启使之生效。

可以看到，flutter安装时会顺便安装dart

3. Flutter和原生混合开发

3.1 集成flutter

在已经有原生工程的情况下，我们需要在同级目录创建

Flutter 

模块，构建

iOS 

和

Android

各自的

Flutter

依赖库。我们只需要在原生项目的同级目录下，执行

Flutter 

命令创建名为

flutter_library 

的模块即可.

• 打开原生项目所在目录，新建termimal窗口
• 输入命令

flutter create -t module flutter_module

创建完成后，在android studio下会出现以下目录结构

3.2 Android原生集成（非aar方式）

• 在android根目录setting.gradle里配置

setBinding(newBinding([gradle:this]))evaluate(newFile(
        settingsDir.parentFile,'flutter_module/.android/include_flutter.groovy'))

在

app

模块下的

build.gradle

里面添加

flutter

依赖
**如果

Binding

飘红，则先删除上述代码，

sync

一下后再加入代码。**

3.3 Android原生集成（aar方式）

• 新建Flutter项目 创建完成后目录结构如下所示
• 调试写好的dart文件 在项目级目录上点击右键->Flutter->Open Android module in Android Studio 打开后Android模块的目录结构如下所示： 直接点击run，它就会加载flutter项目下lib包里的入口页。就可以直接进行调试了。
• 打包aar 打开Flutter项目，然后选择Build->Flutter->Build AAR
• 引入Android项目中 打开你的安卓工程，将aar copy到libs目录下