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