flutter環境搭建教程

在macOS上搭建Flutter開發環境

flutter安裝

  • 使用鏡像
    由於在國內訪問Flutter有時可能會受到限制,Flutter官方爲中國開發者搭建了臨時鏡像,大家可以將如下環境變量加入到用戶環境變量中:

    export PUB_HOSTED_URL=https://pub.flutter-io.cn
    export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
    

    注意: 此鏡像爲臨時鏡像,並不能保證一直可用,讀者可以參考https://flutter.io/community/china 以獲得有關鏡像服務器的最新動態。

  • 獲取 flutter sdk
    官網地址:https://flutter.io/sdk-archive/#macos
    下載後解壓,-d 指定文件解壓縮後所要存儲的目錄。我這裏是解壓至 ~/dev-soft/ 文件夾下

    cd ~/downloads
    unzip  flutter_macos_v1.2.1-stable.zip -d ~/dev-soft/
    

    至此,已經解壓完畢,flutter的目錄爲~/dev-soft/flutter

  • 配置環境變量
    在用戶目錄下打開或創建.bash_profile文件

  1. 創建.bash_profile文件(如果有.bash_profile文件就不用這一步了)

    touch ~/.bash_profile 
    
  2. 打開.bash_profile並編輯:

    open ~/.bash_profile
    
  3. 配置flutter到環境變量中

    export FLUTTER_HOME=/Users/xxx/dev-soft/flutter
    export PATH= $FLUTTER_HOME/bin:$PATH
    
  4. 使修改後的配置生效命令:

    source .bash_profile
    
  5. 驗證“flutter/bin”是否已在PATH中

    echo $PATH
    

    注意: 如果你使用終端是zsh,終端啓動時 ~/.bash_profile 將不會被加載,解決辦法就是修改 ~/.zshrc(如果沒有.zshrc文件,就自己創建),在其中添加:source .bash_profile。

  6. 驗證是否生效,在任意終端運行命令

    flutter doctor
    

xcode安裝

待更新

android studio 安裝

  • 安裝sdk
  • 查看sdk路徑
    AndroidStudio:
    菜單欄AndroidStudio > Preferences > Appearences&Behavior > System Settins > Android SDK tab中的SDK Location。
  • 配置環境變量
    export ANDROID_HOME=~/Library/Android/sdk
    export PATH=$PATH:$ANDROID_HOME/tools
    export PATH=$PATH:$ANDROID_HOME/platform-tools
    export PATH=$PATH:$ANDROID_HOME/build-tools
    
  • 驗證配置是否成功
    命令行輸入adb.如果未顯示command not found,說明此命令有效,環境變量設置完成。
  • 安裝模擬器
    點擊下圖紅線框出來的AVD Manager ,根據提示一步步創建。在這裏,我創建了一個pixel 2。
    在這裏插入圖片描述
    在這裏插入圖片描述

配置編輯器 vscode

  • 安裝Flutter插件
  1. 啓動 VS Code
  2. 調用 View>Command Palette…
  3. 輸入 ‘install’, 然後選擇 Extensions: Install Extension action
  4. 在搜索框輸入 flutter , 在搜索結果列表中選擇 ‘Flutter’, 然後點擊 Install
  5. 選擇 ‘OK’ 重新啓動 VS Code
  • 新建項目

啓動 VS Code
調用 View>Command Palette…
輸入 ‘flutter’, 然後選擇 ‘Flutter: New Project’ action
輸入 Project 名稱 (如myapp), 然後按回車鍵
指定放置項目的位置,然後按藍色的確定按鈕
等待項目創建繼續,並顯示main.dart文件

  • 運行應用程序

確保在VS Code的右下角選擇了目標設備
按 F5 鍵或調用Debug>Start Debugging
等待應用程序啓動
如果一切正常,在應用程序建成功後,您應該在您的設備或模擬器上看到應用程序:

  • 遇到問題
    1.Failed to launch emulator: PANIC: Cannot find AVD system path. Please define ANDROID_SDK_ROOT
    在這裏插入圖片描述
    其實報的這個錯是假象,只需要打開andorid studio中的AVD Manager,創建一個模擬器就ok了
  • x86 emulation currently requires hardware acceleration! Please ensure Intel HAXM is properly installed and usable. CPU acceleration status: HAXM is not installed on this machine
    在這裏插入圖片描述
    解決方法:打開sdk manager, 安裝 inter x86 Emulator accelerator
    在這裏插入圖片描述

搭建問題彙總

  1. Android license status unknown.
    flutter doctor --android-licenses
  2. Android sdkmanager tool not found
    網上有很多人回答說 將 android-sdk/emulator/bin 目錄拷貝至 android-sdk/tools/就可以解決這個問題,但是我發現這樣只能解決當前報錯,在之後運行別的命令時(如sdkmanager --update )還會出現更多問題。
    所以一旦出現這個問題後,我推薦的解決方式是卸載android studio,重裝
  3. sdkmanager --update
    錯誤: 找不到或無法加載主類 com.android.sdklib.tool.sdkmanager.SdkManagerCli
    猜測:jdk版本過高?我安裝的是jdk10版本,現重新安裝jdk1.8,嘗試看是否能解決這個問題。brew cask install java8
    結論:這個還是因爲在對待 Android sdkmanager tool not found 的問題上,處理方式不對。當時是聽信網上一些說法,將emulator/bin 下面拷貝到了android-sdk/tools/下,以爲能解決 Android sdkmanager tool not found 問題,結果在運行 sdkmanager --update 又出現了新的問題。所以還是要卸載android studio,重裝

順便提個小知識點,如何切換jdk版本?

a. 配置環境變量:

	export JAVA_8_HOME="/Library/Java/JavaVirtualMachines/jdk1.8.0_192.jdk/Contents/Home"
	
	export JAVA_11_HOME="/Library/Java/JavaVirtualMachines/openjdk-11.0.1.jdk/Contents/Home"
	#默認JDK 8
	export JAVA_HOME=$JAVA_8_HOME
	
	#alias命令動態切換JDK版本  
	alias jdk8="export JAVA_HOME=$JAVA_8_HOME"    
	alias jdk11="export JAVA_HOME=$JAVA_11_HOME"  

b. 驗證

➜  ~ jdk8
➜  ~ java -version
java version "1.8.0_192"
Java(TM) SE Runtime Environment (build 1.8.0_192-b12)
Java HotSpot(TM) 64-Bit Server VM (build 25.192-b12, mixed mode)
➜  ~
➜  ~ jdk11
➜  ~ java -version
openjdk version "11.0.1" 2018-10-16
OpenJDK Runtime Environment 18.9 (build 11.0.1+13)
OpenJDK 64-Bit Server VM 18.9 (build 11.0.1+13, mixed mode)
  1. 如何查看mac下安裝的jdk版本?
    cd /Library/Java/JavaVirtualMachines
    ls
    
  2. Could not download guava.jar (com.google.guava:guava:23.0)
    這是因爲網絡不好導致的,要不就翻牆,要不就一直flutter run這個項目,觸發 gradle initial,總會成功的。
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章