最近正式入坑Flutter，首先從環(huán)境搭建開(kāi)始，看了網(wǎng)上好多關(guān)于Windows環(huán)境搭建的資料，基本都是按官方文檔寫(xiě)的，看完的感受是，還不如直接去看官方文檔。

官方英文文檔傳送門(mén)：Get Started: Install on Windows 。

本文主要總結(jié)我實(shí)際搭建的過(guò)程，最后發(fā)現(xiàn)不一定按網(wǎng)上那些博客或者官方文檔寫(xiě)的來(lái)也可以搭建成功。

總的來(lái)說(shuō)需要的也就4樣?xùn)|西，找齊了配置一下就OK；

（1）Flutter SDK （建議下載官網(wǎng)的，下載完直接能用）

（2）下載Dart插件

（3）下載Flutter插件

（4）準(zhǔn)備ide（Androidstudio或者IntelliJ IDEA）配置flutter的SDK即可

說(shuō)明

• IntelliJ IDEA 通過(guò)plugins下載的插件都是放在安裝目錄下的plugins文件中，自己看一下就明白。
• Androidstudio 通過(guò)plugins下載的插件是放在默認(rèn)位置的，這一點(diǎn)和IntelliJ IDEA不太一樣，我本地的默認(rèn)的路徑是在 C:\Users\.AndroidStudio3.1\config\plugins 中，假如你已經(jīng)有了Dart和flutter插件，可以解壓后直接拷貝到該目錄下即可。

詳細(xì)的安裝過(guò)程如下：

1. 安裝Flutter SDK

首先下載官方文檔中 flutter_windows_v0.4.4-beta.zip 壓縮包（如下圖紅框中所示），解壓到自己指定的位置，解壓完文件夾名稱(chēng)叫做flutter，這就是Flutter SDK了（后面再ide中配置的時(shí)候需要）。同時(shí)將該文件夾中的bin添加到環(huán)境變量中。

2. 安裝Dart和Flutter插件

（1）Flutter需要如下兩個(gè)插件的支持：

• Flutter 插件用來(lái)支撐Flutter開(kāi)發(fā)者的流程（運(yùn)行，調(diào)試，熱加載，等等）
• Dart插件則提供代碼分析（代碼合法性校驗(yàn)，代碼補(bǔ)全等等）

（2）然后在Androidstudio或者IntelliJ IDEA 中下載Dart插件，假如下不了，那就是沒(méi)有進(jìn)行科學(xué)上網(wǎng)的原因，也可以通過(guò)科學(xué)上網(wǎng)訪問(wèn)下面的鏈接進(jìn)行下載。假如是自己通過(guò)如下鏈接下載的，則把下載后的zip包解壓后將整個(gè)文件夾復(fù)制到你使用的ide的plugins文件夾中（整個(gè)文件夾拷貝到plugins下即可）。

Dart_jb51.rar

（3）然后在Androidstudio或者IntelliJ IDEA 中下載flutter-intellij插件，假如下不了，那就是沒(méi)有進(jìn)行科學(xué)上網(wǎng)的原因，也可以通過(guò)科學(xué)上網(wǎng)訪問(wèn)下面的鏈接進(jìn)行下載。假如是自己通過(guò)如下鏈接下載的，則把下載后的zip包解壓后將整個(gè)文件夾復(fù)制到你使用的ide的plugins文件夾中（整個(gè)文件夾拷貝到plugins下即可）。

flutter-intellij_jb51.rar

（4）說(shuō)明：使用自己的ide安裝步驟如下：

1）啟動(dòng)Android Studio
2） 打開(kāi)插件面板如下圖所示
3）選擇【Browse repositories…】，勾選Flutter plug-in 然后點(diǎn)擊 install
4）當(dāng)提示是否安裝Dart插件時(shí)點(diǎn)擊Yes
5）安裝完成后重啟AS

其實(shí)到這我們需要準(zhǔn)備的東西已經(jīng)全了，下面看如何配置。

3. 配置Dart和Flutter插件到我們的ide中

我使用的是IntelliJ IDEA，Androidstudio類(lèi)似。

打開(kāi)ide，Create New Project——>選擇Flutter，選擇SDK路徑后Next——>命名項(xiàng)目名（小寫(xiě)），選擇項(xiàng)目存儲(chǔ)路徑后ok。

然后進(jìn)去以后可能你看到并沒(méi)有下載項(xiàng)目資源，不要慌，我們配置一下，具體的如下所示，第一張是配置DartSDK的路徑（指向前面flutter的SDK中的 bin\cache\dart.sdk），第二張是配置flutter SDK路徑。配置完成后重啟ide，再重新創(chuàng)建新項(xiàng)目即可，等待的時(shí)間會(huì)比較長(zhǎng)，耐心等待完成就可以開(kāi)啟flutter之旅了。

另外有幾點(diǎn)說(shuō)明：

（1）本人是移動(dòng)端開(kāi)發(fā)所以不管是Androidstudio或者IntelliJ IDEA都已經(jīng)搭建好了，相關(guān)環(huán)境的搭建可查閱網(wǎng)絡(luò)。

（2）本文前面教程中是以IntelliJ IDEA為基礎(chǔ)描述的，假如你使用的是Androidstudio的話需要升級(jí)版本至3.1以上，然后在Androidstudio的Plugins中下載Dart和Flutter插件然后重啟，就會(huì)在創(chuàng)建項(xiàng)目的界面出現(xiàn)創(chuàng)建Flutter的選項(xiàng)，然后創(chuàng)建flutter項(xiàng)目，配置本文中描述的flutter-SDK路徑就可以了。

（3）可能有人看網(wǎng)上的資料迷糊，如下圖怎么來(lái)的，其實(shí)在咱們下載的flutter_windows_v0.4.4-beta.zip解壓包中有flutter_console.bat，雙擊就可以喚起如下界面。它便是flutter的控制臺(tái)，我們可以在flutter控制臺(tái)運(yùn)行 flutter doctor 命令, 檢測(cè)是否有依賴(lài)項(xiàng)未安裝。

（4）文中提到的資料包，有無(wú)法下載的可以在文末留言，給我個(gè)郵箱，我可以打包共享。

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

最新評(píng)論