「Dart语言教程」1.Dart/Flutter开发环境配置

本教程使用的操作系统是Windows 11,后续的教程也将以Windows为主要开发环境来学习和使用Dart编程语言,学习Dart语言的主要目的是进行Flutter应用程序的开发,因此,我没有下载Dart官方提供的SDK开发包,而是使用Flutter SDK中集成的Dart语言SDK开发包,完成Flutter SDK配置之后,我们既可以在此环境下开发Dart应用程序,也可以在此环境下开发Flutter应用程序。Flutter应用开发使用了Android Studio集成开发环境,Dart应用开发则使用Visual Studio Code进行开发。Dart应用开发以学习这种语言及其核心库为目标,Flutter应用开发则以实际项目为主要目标。下文将介绍在安装Flutter SDK中遇到的问题及其对应的解决方法。

下载SDK包

进行Dart/Flutter应用开发时,首先需要下载对应的软件开发工具包,即我们通常所说的SDK,打开Flutter的官方网站(www.flutter.dev),下载Flutter SDK的压缩包,目前最新的SDK版本为3.0.2。下载完成之后将其解压到指定位置,注意在设定Flutter SDK的解压路径时,尽可能的保持路径简单,不要含有空格或其它多字节字符,比如直接将其设置为d:\flutter3.0.2即可。文本将采用此路径作为Flutter SDK的解压路径。

环境变量

完成Flutter SDK的解压工作之后,接下来我们需要配置三个环境变量:PUB_HOSTED_URL、FLUTTER_STORAGE_BASE_URL和Path变量。


「Dart语言教程」1.Dart/Flutter开发环境配置

表1

注意最后的Path环境变量是向其追加一个路径,而不是将原有的Path变量的值设置为上述的内容。

诊断Flutter环境

完成环境变量的设置之后,重新启动一个命令行窗口,执行下面的命令进行诊断:

flutter doctor

这个命令可能会执行一段时间,请耐心等待。执行完上述的诊断命令之后,它会提示你当前系统都有哪些项目是无法满足开发Flutter开发或者是可能存在问题的。按照doctor报告中的错误或警告逐项进行修复。下面列出我在安装Flutter SDK时所遇到的问题。

Android命令行工具没有安装

启动Android Studio应用程序,打开SDK管理器,并切换至SDK Tools标签,选中下图中的命令行工具,进行安装。

「Dart语言教程」1.Dart/Flutter开发环境配置

图1

安装Chrome浏览器

Windows 11默认使用了Edge浏览器,而doctor认为这个浏览器不符合它的标准,当前系统必须得含有一个chrome应用才可以,提示如下图2所示的错误

「Dart语言教程」1.Dart/Flutter开发环境配置

图2

对于这个错误,我也没有其它更好的办法可以解决,安装一个chrome浏览器就是了。

Android协议问题

如图2中的提示,在命令行中运行flutter doctor –android-licenses,所有的提示问题全部选择”y”,表示接受相应的协议内容,不接受不让使用啊!

「Dart语言教程」1.Dart/Flutter开发环境配置

图3

无法访问maven.google.com问题

打开D:\flutter3.0.2\flutter\packages\flutter_tools\lib\src\http_host_validator.dart文件,如果你的Flutter SDK解压路径与本文中的解压路径不同,请按照实际路径进行相应地调整。按照下图4的内容,注释掉第31行代码,添加第32行代码。

「Dart语言教程」1.Dart/Flutter开发环境配置

图4

我们再次执行flutter doctor命令,它的输出结果全部正常了,如下图5所示,如果你的系统上安装的软件与我的机器上的开发软件不一样,可能还会有其它的错误提示,按照doctor给出的错误报告逐项解决每一个问题,这样也为后续进行Flutter应用开发做好了准备。

「Dart语言教程」1.Dart/Flutter开发环境配置

图5

Visual Studio Code安装Dart插件

启动Visual Studio Code应用程序,在在线插件库中搜索“Dart”关键字,安装Dart语言插件,它提供了Dart语言编辑、重构和调试等功能,Dart语言学习主要是在Visual Studio Code中使用此插件来进行应用程序开发,安装完成这个插件之后,就可以开始Dart语言程序的开发了。

第一个Dart程序

启动Visual Studio Code程序,打开一个新的空白目录,并在这个目录下新建一个文件,将其命名为hello-world.dart,在这个文件中输入下图6所示的代码。

「Dart语言教程」1.Dart/Flutter开发环境配置

图6

图6中第1-3行代码定义了一个main函数,这个main函数的函数体中 只含有一条语句,即第2行代码,它将字符串”hello world”输出到标准输出设备上。注意在第一行代码的上一行出现了两个按钮:Run和Debug。点击这个“Run“按钮,在Visual Studio Code的输出窗口会显示如下的内容。

「Dart语言教程」1.Dart/Flutter开发环境配置

图7

蓝色文字内容就是我们在代码中调用print函数的输出结果。这样就表示我们现在的开发环境已经可以编译并运行Dart语言编写的程序了。开发环境已经配置好了,后续将陆续介绍Dart/Flutter应用程序开发相关的内容。

总结

万事开头难,学习一种语言或一个框架,其最大的一个障碍其实是它的开发环境的准备工作,如果没有合适的、可以使用的开发环境,只从阅读文档是无法编写出正确、可用的应用程序,本文是Dart编程语言学习的第一篇文章,它的目的就是配置其开发环境,如果你已经能够正确地运行第一个程序,那么,恭喜你来到了Dart/Flutter的世界,之后,我将和你一同探寻Dart/Flutter的精彩。谢谢阅读,我们下一篇文章见。

发表评论
留言与评论(共有 0 条评论) “”
   
验证码:

相关文章

推荐文章