快速导航
安装
安装flutter
-
首先下载flutter包, 解压到
~/repo目录,并配置~/.bashrc1export PATH=$PATH:$HOME/repo/flutter/bin -
source ~/.bashrc使其生效注意：首次运行flutter，macos可能会提示无法打开dart，需要到
系统偏好 -> 安全性与隐私点击允许1└──╼ flutter --version 2Flutter 2.2.1 • channel stable • https://github.com/flutter/flutter.git 3Framework • revision 02c026b03c (9 天前) • 2021-05-27 12:24:44 -0700 4Engine • revision 0fdb562ac8 5Tools • Dart 2.13.1 -
第一步，禁用 google analytics
1└──╼ flutter config --no-analytics 2 3 ╔════════════════════════════════════════════════════════════════════════════╗ 4 ║ Welcome to Flutter! - https://flutter.dev ║ 5 ║ ║ 6 ║ The Flutter tool uses Google Analytics to anonymously report feature usage ║ 7 ║ statistics and basic crash reports. This data is used to help improve ║ 8 ...... 9 ║ See Google's privacy policy: ║ 10 ║ https://policies.google.com/privacy ║ 11 ╚════════════════════════════════════════════════════════════════════════════╝ 12 13Analytics reporting disabled. 14 15You may need to restart any open editors for them to read new settings. -
第二步, 执行
flutter doctor检查依赖环境1└──╼ flutter doctor 2Running "flutter pub get" in flutter_tools... 10.6s 3Doctor summary (to see all details, run flutter doctor -v): 4[✓] Flutter (Channel stable, 2.2.1, on macOS 11.3.1 20E241 darwin-x64, locale zh-Hans-CN) 5[✗] Android toolchain - develop for Android devices 6 ✗ Unable to locate Android SDK. 7 Install Android Studio from: https://developer.android.com/studio/index.html 8 On first launch it will assist you in installing the Android SDK components. 9 (or visit https://flutter.dev/docs/get-started/install/macos#android-setup for detailed instructions). 10 If the Android SDK has been installed to a custom location, please use 11 `flutter config --android-sdk` to update to that location. 12 13[✗] Xcode - develop for iOS and macOS 14 ✗ Xcode installation is incomplete; a full installation is necessary for iOS development. 15 Download at: https://developer.apple.com/xcode/download/ 16 Or install Xcode via the App Store. 17 Once installed, run: 18 sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer 19 sudo xcodebuild -runFirstLaunch 20 ✗ CocoaPods not installed. 21 CocoaPods is used to retrieve the iOS and macOS platform side's plugin code that responds to your plugin usage on the Dart side. 22 Without CocoaPods, plugins will not work on iOS or macOS. 23 For more info, see https://flutter.dev/platform-plugins 24 To install see https://guides.cocoapods.org/using/getting-started.html#installation for instructions. 25[✓] Chrome - develop for the web 26[!] Android Studio (not installed) 27[✓] VS Code (version 1.56.2) 28[✓] Connected device (1 available) 29 30! Doctor found issues in 3 categories.
安装java
-
安装
1└──╼ brew install openjdk@8刚开始我安装的是 openjdk@11, 但在启动 sdkmanager 时会报
1└──╼ /usr/local/share/android-sdk/tools/bin/sdkmanager 2Exception in thread "main" java.lang.NoClassDefFoundError: javax/xml/bind/annotation/XmlSchema 3 at com.android.repository.api.SchemaModule$SchemaModuleVersion.<init>(SchemaModule.java:156) 4 at com.android.repository.api.SchemaModule.<init>(SchemaModule.java:75) 5 at com.android.sdklib.repository.AndroidSdkHandler.<clinit>(AndroidSdkHandler.java:81) 6 at com.android.sdklib.tool.sdkmanager.SdkManagerCli.main(SdkManagerCli.java:73) 7 at com.android.sdklib.tool.sdkmanager.SdkManagerCli.main(SdkManagerCli.java:48) 8Caused by: java.lang.ClassNotFoundException: javax.xml.bind.annotation.XmlSchema 9 at java.base/jdk.internal.loader.BuiltinClassLoader.loadClass(BuiltinClassLoader.java:581) 10 at java.base/jdk.internal.loader.ClassLoaders$AppClassLoader.loadClass(ClassLoaders.java:178) 11 at java.base/java.lang.ClassLoader.loadClass(ClassLoader.java:522)查找网上的资料，即使设置了
JAVA_OPTS, 但还是有问题，所以我安装openjdk@8而不是openjdk@111└──╼ export JAVA_OPTS='-XX:+IgnoreUnrecognizedVMOptions --add-modules java.se.ee' 2└──╼ /usr/local/share/android-sdk/tools/bin/sdkmanager 3Error occurred during initialization of boot layer 4java.lang.module.FindException: Module java.se.ee not found -
配置环境变量
1export JAVA_HOME=/usr/local/opt/openjdk@8 2export PATH=$JAVA_HOME/bin:$PATH如果未设置
JAVA_HOME环境变量，后续执行flutter doctor可能会报1The operation couldn’t be completed. Unable to locate a Java Runtime. 2Please visit http://www.java.com for information on installing Java.
安装android sdk
-
安装sdk
1└──╼ brew install android-sdk -
安装sdk组件 首先执行
sdkmanager --list找到组件最新版本或者选择合适版本1└──╼ sdkmanager platform-tools 2└──╼ sdkmanager 'platforms;android-29' 3└──╼ sdkmanager 'build-tools;31.0.0-rc4' 4└──╼ sdkmanager --licenses如果未执行
sdkmanager --licenses并同意相关协议，在执行flutter doctor后可能会提示1[!] Android toolchain - develop for Android devices (Android SDK version 31.0.0-rc4) 2 ! Some Android licenses not accepted. To resolve this, run: flutter doctor --android-licenses -
配置环境变量
1export ANDROID_SDK_ROOT=/usr/local/share/android-sdk 2export PATH=$ANDROID_SDK_ROOT/tools:$ANDROID_SDK_ROOT/platform-tools:$PATH
初体验
创建一个新的项目
1└──╼ flutter create myapp
2└──╼ cd myapp注意不要在 flutter sdk 目录里创建项目
1Cannot create a project within the Flutter SDK. Target directory '$HOME/repo/flutter/src/myapp' is within the Flutter SDK at
2'$HOME/repo/flutter'.配置android模拟器
-
安装模拟器
1└──╼ sdkmanager emulator 2└──╼ sdkmanager 'system-images;android-29;google_apis;x86_64' -
创建新的android模拟器
1└──╼ avdmanager -s create avd -n testAndroid -k "system-images;android-29;google_apis;x86_64" 2└──╼ avdmanager list avd
启动flutter项目
-
启动模拟器
1└──╼ flutter emulators 21 available emulator: 3 4testAndroid • testAndroid • • android 5 6To run an emulator, run 'flutter emulators --launch <emulator id>'. 7To create a new emulator, run 'flutter emulators --create [--name xyz]'. 8 9You can find more information on managing emulators at the links below: 10https://developer.android.com/studio/run/managing-avds 11https://developer.android.com/studio/command-line/avdmanager 12└──╼ flutter emulators --launch testAndroid -
查看可用驱动
1└──╼ flutter devices 22 connected devices: 3 4Android SDK built for x86 64 (mobile) • emulator-5554 • android-x64 • Android 10 (API 29) (emulator) 5Chrome (web) • chrome • web-javascript • Google Chrome 90.0.4430.212 -
启动项目
1└──╼ flutter run -d emulator-5554![]()
至此，我的第一个flutter应用体验完成。
很久没学习新的技术，感觉自己都快落伍了，脑子也快生锈了，很早之前就打算自己写一个私人使用的 app，但总抱着一招鲜吃遍天的想法，坚持着熟悉的vue web app, 而且还道听途说对flutter有所怀疑，一直没实际体验过。虽然vue足够简单，搭配cordova也很方便，但毕竟属于web app，每种语言或者工具应该都有自己最擅长的领域，比如vue之于 web，flutter至于 移动端app，最重要的是，现在技术更新迭代太快，你不学总有人学，学而不思则罔，思而不学则殆，不思不学只会被淘汰
升级Flutter版本
升级步骤
-
查看当前使用的版本
1└──╼ flutter channel 2 3Flutter channels: 4master 5dev 6beta 7* stable -
选择版本(可选)
1└──╼ flutter channel stable -
升级
1└──╼ flutter upgrade
FAQ
-
Flutter目录有修改
1[ +8 ms] Your flutter checkout has local changes that would be erased by upgrading. If you want to keep these changes, it is recommended that you stash them via "git stash" or else commit the changes 2to a local 3 branch. If it is okay to remove local changes, then re-run this command with "--force". 4....进入Flutter目录，使用
git diff1──╼ git diff 2diff --git a/packages/flutter_tools/gradle/flutter.gradle b/packages/flutter_tools/gradle/flutter.gradle 3index 3db040b967..69db8a4873 100644 4--- a/packages/flutter_tools/gradle/flutter.gradle 5+++ b/packages/flutter_tools/gradle/flutter.gradle 6@@ -24,8 +24,17 @@ import org.gradle.util.VersionNumber 7 8 buildscript { 9 repositories { 10- google() 11- jcenter() 12+ // google() 13+ // jcenter() 14+ maven { 15+ url 'https://maven.aliyun.com/repository/jcenter' 16+ } 17+ maven { 18+ url 'http://maven.aliyun.com/nexus/content/groups/public' 19+ } 20+ maven { 21+ url 'https://maven.aliyun.com/repository/google' 22+ } 23 } 24 dependencies { 25 classpath 'com.android.tools.build:gradle:4.1.0'使用
git reset --hard重置修改，或者使用flutter upgrade --force强制更新
FAQ
启动项目报 Operation timed out
1Using hardware rendering with device Android SDK built for x86 64. If you notice graphics artifacts, consider enabling software rendering with
2"--enable-software-rendering".
3Launching lib/main.dart on Android SDK built for x86 64 in debug mode...
4Exception in thread "main" java.net.ConnectException: Operation timed out (Connection timed out)
5 at java.net.PlainSocketImpl.socketConnect(Native Method)
6 at java.net.AbstractPlainSocketImpl.doConnect(AbstractPlainSocketImpl.java:350)
7 at java.net.AbstractPlainSocketImpl.connectToAddress(AbstractPlainSocketImpl.java:206)
8 ......
9 at org.gradle.wrapper.WrapperExecutor.execute(WrapperExecutor.java:128)
10 at org.gradle.wrapper.GradleWrapperMain.main(GradleWrapperMain.java:61)
11Running Gradle task 'assembleDebug'...
12Running Gradle task 'assembleDebug'... Done 76.2s
13Exception: Gradle task assembleDebug failed with exit code 1
这是因为无法下载 gradle 的包和依赖，需要科学上网或者修改为国内源
-
修改项目目录下的
android/gradle/wrapper/gradle-wrapper.properties文件1- distributionUrl=https\://services.gradle.org/distributions/gradle-6.7-all.zip 2+ distributionUrl=https\://mirrors.cloud.tencent.com/gradle/gradle-6.7-all.zip -
修改项目目录下
android/build.gradle1- google() 2- jcenter() 3+ maven { url 'https://maven.aliyun.com/repository/google' } 4+ maven { url 'https://maven.aliyun.com/repository/jcenter' } 5+ maven { url 'http://maven.aliyun.com/nexus/content/groups/public' } -
修改 flutter sdk 目录下
packages/flutter_tools/gradle/flutter.gradle1buildscript { 2 repositories { 3! // google() 4! // jcenter() 5! maven { 6! url 'https://maven.aliyun.com/repository/jcenter' 7! } 8! maven { 9! url 'http://maven.aliyun.com/nexus/content/groups/public' 10! } 11! maven { 12! url 'https://maven.aliyun.com/repository/google' 13! } 14 } 15 dependencies { 16 classpath 'com.android.tools.build:gradle:4.1.0' 17 } 18 }
Unable to locate Android SDK
1└──╼ flutter doctor
2Doctor summary (to see all details, run flutter doctor -v):
3[✓] Flutter (Channel stable, 3.3.4, on macOS 12.5 21G72 darwin-x64, locale zh-Hans-CN)
4[✗] Android toolchain - develop for Android devices
5 ✗ Unable to locate Android SDK.
6 Install Android Studio from: https://developer.android.com/studio/index.html
7 On first launch it will assist you in installing the Android SDK components.
8 (or visit https://flutter.dev/docs/get-started/install/macos#android-setup for detailed instructions).
9 If the Android SDK has been installed to a custom location, please use
10 `flutter config --android-sdk` to update to that location.解决:
1└──╼ flutter config --android-sdk /usr/local/share/android-sdk
2Setting "android-sdk" value to "/usr/local/share/android-sdk".
3
4You may need to restart any open editors for them to read new settings.
知识共享署名-非商业性使用-相同方式共享4.0国际许可协议
