flutter1.9 + vscode + Andorid SDK + java JDK實踐

前提

如果已安裝Git for Windows叛买,請確保命令提示符或PowerShell中運行?git?命令唬党,不然在后面運行flutter doctor時將出現(xiàn)Unable to find git in your PATH錯誤, 此時需要手動添加C:\Program Files\Git\bin至Path系統(tǒng)環(huán)境變量中

第一步:安裝flutter

step 1

? ? 配置鏡像環(huán)境變量---讓flutter命令執(zhí)行更快秃嗜,比如pub下載依賴

? ? PUB_HOSTED_URL=https://pub.flutter-io.cn

? ? FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

step 2

拉代碼git? clone? https://github.com/flutter/flutter供汛,(如:C:\src\flutter;注意建椰,不要將flutter安裝到需要一些高權(quán)限的路徑如C:\Program Files\)

在Flutter安裝目錄的flutter文件下找到flutter_console.bat获雕,雙擊運行并啟動flutter命令行,

step3

配置fultter環(huán)境變量收捣,以便使用flutter命令:在path加入的路勁指向flutter文件夾的bin目錄届案,例如:C:\flutter\bin

接下來,你就可以在Flutter命令行運行flutter命令了

完成以上三步就成功安裝了flutter罢艾,運行flutter doctor -v 查看具體信息楣颠,會提示Andorid SDK未安裝等

第二步: vscode安裝插件

? 在插件市場安裝flutter,dart

第三步: java jdk 安裝

?? 目的:執(zhí)行java -version能成功展示版本號

為了避免高版本帶來的不必要影響咐蚯,我這里安裝 java8

第四步: 下載Andorid SDK?

注意:建議使用andriod studio直接批量下載(不踩坑童漩,avd版本高且服務(wù)齊全),以下介紹權(quán)當了解配置

? ? 我在這里下載: 這里面有? SDK Tools (Android SDK的可下載組件春锋。它包括用于Android SDK的完整開發(fā)和調(diào)試工具集)+ SDK Platform-Tools (這是 adb, fastboot 等工具包) +? Build-Tools (這是Android開發(fā)所需的Build-Tools) + Andorid? SDK? 的組合矫膨。可以在網(wǎng)站里下載相應(yīng)的版本組合到一個文件夾,也可以使用SDK Manager 來可視化管理以上所有需要的東西

? ? ? ? 這里我選擇在網(wǎng)站下載一個SDK Manager


? ? ? ? 下載上圖中第二個圈圈中的侧馅,運行SDK manager.exe

運行后查看大神的詳細介紹危尿,一路安裝會發(fā)現(xiàn),原本空空的platforms 文件夾有了安裝sdk馁痴。也多了build-tools谊娇,platform-tools

再來配置platform-tools和tools的環(huán)境變量,查看文件夾就能明白是為了讓你能執(zhí)行adb罗晕,和sdkmanager 和其他 命令

? 注意android sdk環(huán)境變量需要在path后面添加\platform-tools和\tools兩條路徑济欢,我的文件放在這個testjdk文件夾

把這句;D:\testjdk\platform-tools;D:\testjdk\tools\bin添加到系統(tǒng)變量Path后面就行了

在cmd命令窗口輸入android -h驗證環(huán)境變量是否配置成功

---------------以上就是全部安裝內(nèi)容-----------

遇到的問題

1.在命令提示符或PowerShell窗口中運行此命令。目前小渊,F(xiàn)lutter不支持像Git Bash這樣的第三方shell法褥。

? ? ? 不然會提示:SocketException: OS Error 信號燈超時時間已到,讓你一臉懵逼粤铭,無法繼續(xù)挖胃。

?2. windows7上 cmd指向有時候會出問題,例如嘗試找git的安裝目錄:執(zhí)行 where git? 會提示where不是內(nèi)部或者外部命令梆惯,而flutter需要git

可以發(fā)現(xiàn)C:\Windows\System32里面搜索cmd.exe可以執(zhí)行命令酱鸭。將C:\Windows\System32添加到環(huán)境變量即可

3. adb.exe 是Andriod SDK 里面用來橋接設(shè)備的,位于platform-tools文件夾內(nèi)垛吗,如果配置環(huán)境變量后執(zhí)行adb提示無法執(zhí)行凹髓,

也許是安裝的程序過于精簡沒有附帶共用的dll,可以嘗試安裝“微軟常用運行庫集合”怯屉。 還有可能是進程端口被占用蔚舀,打開任務(wù)管理器如果有運行中的adb,右鍵查看是運行的文件夾锨络,不是自己想要的就殺掉

? 提示:adb.exe 0xc000007b 應(yīng)用程序無法正常啟動

解決: 嘗試安裝?微軟常用運行庫合集赌躺,重啟解決


4. 證書許可?

網(wǎng)上說要執(zhí)行flutter doctor --android-licenses? 無效,提示Unknown argument --licenses參數(shù)未知


網(wǎng)上說是因為sdkmanager版本太低羡儿,嘗試升級sdk? sdkmanager --update? 要直到執(zhí)行sdkmanager? --help里面出現(xiàn) --licenses命令才算升級成功礼患,

解決這個問題要知道Andorid sdk目錄結(jié)構(gòu)。會發(fā)現(xiàn)sdkmanager.exe在 tools\bin 目錄下掠归。環(huán)境變量的路徑要設(shè)置到bin目錄缅叠,要么直接在bin目錄shirft + 右鍵打開命令窗口。我選擇添加環(huán)境變量


? 但是很尷尬虏冻,我升級很多次都沒有出現(xiàn)這--licenses命令

3.嘗試下載 tools 文件夾? 看看有沒有此命令


進入下載的tools文件夾打開cmd肤粱,執(zhí)行 sdkmanager --help? 發(fā)現(xiàn)有l(wèi)icenses命令,替換掉我的testjdk文件夾中的整個tools文件夾厨相。

趕緊執(zhí)行 flutter doctor -v 看看

根據(jù)下面的提示看起來是下載的sdk指向不對领曼,而且替換文件夾后sdk manager.exe 無法運行了(暫不影響鸥鹉,可以用sdkmanager --help 命令行查看可安裝的進行安裝)。


此時我計劃新建一個testjdk悯森,去重新下載了一個宋舷,運行上圖的SDK Manager.exe 下載所有需要的安卓sdk版本后,再替換tools文件夾瓢姻,這里下載了第一個安裝包祝蝠。

(其實網(wǎng)站里面也可以單獨下載sdk,tools幻碱,build-tools等等自己去組合)


注意改變環(huán)境變量绎狭,然后測試,會提示 Some Android licenses not accepted.? To resolve this, run: flutter doctor --android-licenses

這里按照提示執(zhí)行即可褥傍,一路yes就成功了


----------新建flutter 項目----------

在vscode? ? crtl + shift + p? ?

選擇第一項 flutter? new project

輸入項目名

成功

下載夜神模擬器

? 提示驅(qū)動版本過低 ---- 驅(qū)動精靈---驅(qū)動升級一個

? cd 到對應(yīng)夜神模擬器?目錄

打開cmd? 執(zhí)行 nox_adb.exe connect 127.0.0.1:62001? ? (把安裝目錄下的bin目錄路徑放入環(huán)境變量)

mumu模擬器同理?

adb_server.exe connect 127.0.0.1:7555

vs code打開的flutter項目就能看到右下角有了設(shè)備號

問題: 如果adb? devices沒有看到設(shè)備儡嘶,鏈接設(shè)備容易出現(xiàn)靈異情況,時常連不上恍风,多試幾次吧蹦狂,或者nox_adb.exe disconnect 127.0.0.1:62001 后再試

----------新建flutter-web 項目----------

flutter channel 查看flutter分支

flutter channel? beta? 切換到beta分支(據(jù)說beta分支才有web支持)

切換分之后輸入flutter 報錯

沒有powershell ?朋贬?凯楔? windows 7 sp1 是有的,powershell 2.0

單擊“開始”锦募、“所有程序”摆屯、“附件”和“Windows PowerShell”,然后單擊“Windows PowerShell”

Get-Host | Select-Object Version

萬能的stackoverflow 有人踩坑糠亩,?嘗試下載Windows Management Framework 5.1

stackoverflow 里面的鏈接下載的包要看和自己電腦匹不匹配虐骑,我的就不匹配,重啟過程中提示:update 失敗

只能去查官方文檔了赎线,還是官方文檔詳細:我的渣渣 win7 sp1 還要先安裝先決條件.NET Framework 4.5.2廷没。 下面寫的非常清楚了

重啟電腦,發(fā)現(xiàn)windows update成功垂寥,驗證flutter腕柜,可以看到切換分支后在重新下載dart pub等



1.安裝 webdev是啟動本地服務(wù)器使用: flutter pub global activate webdev

2. 根據(jù)提示配置環(huán)境變量? C:\flutter\.pub-cache\bin? (我的flutter放在c盤)


在C:\flutter\.pub-cache\bin 打開cmd運行webdev serve 出現(xiàn)錯誤“‘dart’ 不是內(nèi)部或外部命令,也不是可運行的程序 或批處理文件矫废。 ‘pub’ 不是內(nèi)部或外部命令,也不是可運行的程序 或批處理文件砰蠢”推耍“

配置環(huán)境變量dart-sdk。在flutter的bin目錄中台舱。C:\flutter\bin\cache\dart-sdk

在path變量最后添加dart路徑=》安裝flutter存放路徑\flutter\bin\cache\dart-sdk\bin

------首次創(chuàng)建新flutter-web項目(在stable分支)----------

1.? vs code 創(chuàng)建項目? ctrl + shift + p? ? 點擊下拉中的flutter new? project律杠。輸入項目名即可(這樣新建的項目包含android和ios潭流,還沒有web文件夾。不是我想要的)

2. 命令行創(chuàng)建 web 項目需要安裝另一個工具?

? ? 執(zhí)行:flutter pub global activate stagehand

跟安裝 webdev 一樣 安裝成功后可以執(zhí)行下面命令查看幫助 flutter pub global run stagehand


可以看到這里有7中方式建項目柜去,我選擇了web-simple (網(wǎng)友的第二項是:flutter-web, 私以為網(wǎng)友新建的項目已經(jīng)配置好flutter-web依賴灰嫉,我這里沒有只能自己配置)

找到一個放項目的文件夾:執(zhí)行 flutter pub global run stagehand web-simple 創(chuàng)建項目

根據(jù)提示執(zhí)行 pub get 解析依賴包

執(zhí)行webdev serve,跑起來了嗓奢。運行就在chrome打開localhost:8080即可


3. 配置依賴讼撒,pub get 會很慢,耐心等待股耽。根盒。。物蝙。炎滞。

? 再次webdev serve


打包:webdev build


------第二次創(chuàng)建新flutter-web項目(在beta分支)----------

在vs code? ? ctrl + shift + p? 可以看到 flutter new project (還是沒有看見網(wǎng)友的 flutter new? web? project)

選擇,輸入項目名诬乞,創(chuàng)建成功

或者

flutter create myapp

cd myapp

由于我之前開啟了web支持(flutter config --enable-web) 可以發(fā)現(xiàn)項目里面有web文件夾册赛,

根據(jù)提示,執(zhí)行flutter run震嫉,可以看見有兩個設(shè)備

選擇在chrome打開項目flutter run-d? chrome? 提示Failed to bind web development server


解決:點擊這里查看

flutter run -d chrome --web-port=8080 --web-hostname=?the value of IPv4 Address ( ipconfig 找到IPv4 )運行成功


打包web flutter build web 會看見生成的build文件夾森瘪,代碼被編譯成js


下面探索移動端開發(fā)鏈接設(shè)備

# 查看是否連接安卓設(shè)備:包括真機,或者 AVD(開發(fā)工具提供的虛擬設(shè)備)

$ flutter devices

# 查看可用的 AVD

$? flutter emulators

1 available emulator:

Nexus_5X_API_28 ? Nexus 5X ? Google ? Nexus 5X API 28

# 啟用 AVD责掏,會自動打開虛擬設(shè)備柜砾,

$ flutter emulator --launch Nexus_5X_API_28 ? Nexus 5X ? Google ? Nexus 5X API 28

可用的AVD,可以運行在放置安卓sdk目錄的? AVD? Manager.exe 去新建

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末换衬,一起剝皮案震驚了整個濱河市痰驱,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌瞳浦,老刑警劉巖担映,帶你破解...
    沈念sama閱讀 218,941評論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異叫潦,居然都是意外死亡蝇完,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,397評論 3 395
  • 文/潘曉璐 我一進店門矗蕊,熙熙樓的掌柜王于貴愁眉苦臉地迎上來短蜕,“玉大人,你說我怎么就攤上這事傻咖∨竽В” “怎么了?”我有些...
    開封第一講書人閱讀 165,345評論 0 356
  • 文/不壞的土叔 我叫張陵卿操,是天一觀的道長警检。 經(jīng)常有香客問我孙援,道長蜒什,這世上最難降的妖魔是什么奔害? 我笑而不...
    開封第一講書人閱讀 58,851評論 1 295
  • 正文 為了忘掉前任,我火速辦了婚禮绪囱,結(jié)果婚禮上镶奉,老公的妹妹穿的比我還像新娘础淤。我一直安慰自己,他們只是感情好腮鞍,可當我...
    茶點故事閱讀 67,868評論 6 392
  • 文/花漫 我一把揭開白布值骇。 她就那樣靜靜地躺著,像睡著了一般移国。 火紅的嫁衣襯著肌膚如雪吱瘩。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,688評論 1 305
  • 那天迹缀,我揣著相機與錄音使碾,去河邊找鬼。 笑死祝懂,一個胖子當著我的面吹牛票摇,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播砚蓬,決...
    沈念sama閱讀 40,414評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼矢门,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了灰蛙?” 一聲冷哼從身側(cè)響起祟剔,我...
    開封第一講書人閱讀 39,319評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎摩梧,沒想到半個月后物延,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,775評論 1 315
  • 正文 獨居荒郊野嶺守林人離奇死亡仅父,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,945評論 3 336
  • 正文 我和宋清朗相戀三年叛薯,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片笙纤。...
    茶點故事閱讀 40,096評論 1 350
  • 序言:一個原本活蹦亂跳的男人離奇死亡耗溜,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出省容,到底是詐尸還是另有隱情抖拴,我是刑警寧澤,帶...
    沈念sama閱讀 35,789評論 5 346
  • 正文 年R本政府宣布蓉冈,位于F島的核電站城舞,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏寞酿。R本人自食惡果不足惜家夺,卻給世界環(huán)境...
    茶點故事閱讀 41,437評論 3 331
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望伐弹。 院中可真熱鬧拉馋,春花似錦、人聲如沸惨好。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,993評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽日川。三九已至蔓腐,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間龄句,已是汗流浹背回论。 一陣腳步聲響...
    開封第一講書人閱讀 33,107評論 1 271
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留分歇,地道東北人傀蓉。 一個月前我還...
    沈念sama閱讀 48,308評論 3 372
  • 正文 我出身青樓,卻偏偏與公主長得像职抡,于是被迫代替她去往敵國和親葬燎。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 45,037評論 2 355