flutter vscode环境搭建

￡神魔★判官ぃ 2021-12-10 09:13 409阅读 0赞

前面使用android搭建了flutter的开发环境，众所周知的是android运行需要很大的内存空间，如果在把模拟器跑起来，那速度就够我们头疼了。。。当然了电脑配置好的就不需要在意了。

这里我们在介绍一ge常见的软件：vscode，这是一款很轻便的开发工具，其中各种插件可以让我们写代码十分顺手。所以这款软件自从问世以来，就受到了许多人的喜欢。

vscode下载地址：[https://code.visualstudio.com/][https_code.visualstudio.com]

安装后的界面如下：  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Fpbmd5dWxvdmU_size_16_color_FFFFFF_t_70]

接下来，我们开始fullter的配置之旅。

安装flutter扩展程序  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Fpbmd5dWxvdmU_size_16_color_FFFFFF_t_70 1]  
Awesome Flutter Snippets可以帮助我们快速书写flutter的代码，这里我们也一并安装了。

打开终端，运行flutter doctor -v检查环境。

这里主要提醒大家一点，如果运行结果提示： android sdk status unkonwn.那么请确认你的 JAVA SDK 版本是否高于 v8，如果是，请降级到 1.8.0。

创建一个flutter项目：  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Fpbmd5dWxvdmU_size_16_color_FFFFFF_t_70 2]

输入程序名称  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Fpbmd5dWxvdmU_size_16_color_FFFFFF_t_70 3]

选择工程目录  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Fpbmd5dWxvdmU_size_16_color_FFFFFF_t_70 4]

等待创建完成

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Fpbmd5dWxvdmU_size_16_color_FFFFFF_t_70 5]  
运行程序： flutter run  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Fpbmd5dWxvdmU_size_16_color_FFFFFF_t_70 6]

当然了，这里我是提前启动了AVD。

如果你也出现了上面的红色错误，那么重新创建一个低版本的虚拟机试试吧。

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Fpbmd5dWxvdmU_size_16_color_FFFFFF_t_70 7]

当然了我们可以写一个脚本程序来快速启动模拟器，省了我们从android启动的烦恼。我的脚本如下：

D:\AndroidStudioSDK\emulator\emulator.exe -netdelay none -netspeed full -avd NexusS23

\-netdelay none :设置模拟器的网络延迟时间，默认为none，就是没有延迟  
\-netspeed full: 设置网络加速值，full代表全速

其中“D:\\AndroidStudioSDK\\emulator\\emulator.exe”是android sdk安装目录下的文件路劲，“NexusS23”是我们模拟器的名称。

一般来说android的模拟器的安装路径在用户目录下的.android文件中，在这里你可以找到自己需要的模拟器。

C:\Users\lenovo\.android

![在这里插入图片描述][20190713213239848.png]

[https_code.visualstudio.com]: https://code.visualstudio.com/
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Fpbmd5dWxvdmU_size_16_color_FFFFFF_t_70]: /images/20211210/1002b93ecf78488bb646422732769189.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Fpbmd5dWxvdmU_size_16_color_FFFFFF_t_70 1]: /images/20211210/1717d72180c84dde879d2bc4a4e295c2.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Fpbmd5dWxvdmU_size_16_color_FFFFFF_t_70 2]: /images/20211210/3bfcf4ade37f44deb6451c4875e50335.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Fpbmd5dWxvdmU_size_16_color_FFFFFF_t_70 3]: /images/20211210/a494cfcc1c524db78a2d9ae0f50b2ead.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Fpbmd5dWxvdmU_size_16_color_FFFFFF_t_70 4]: /images/20211210/8a70428a43e34664a119044b0187d8dd.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Fpbmd5dWxvdmU_size_16_color_FFFFFF_t_70 5]: /images/20211210/9b00f2bbdb0047f49fa65319d08d2a46.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Fpbmd5dWxvdmU_size_16_color_FFFFFF_t_70 6]: /images/20211210/8ec45432be244f28b4afeb8705debbb6.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Fpbmd5dWxvdmU_size_16_color_FFFFFF_t_70 7]: /images/20211210/8650564c84a34c4c976e097a09198311.png
[20190713213239848.png]: /images/20211210/7ca0d383e8bd4b088327f6e3f04750da.png