一、安装VScode编辑器,并在vscode安装flutter和Dart插件

1、安装vscode插件:

1)搜索Flutter插件并安装

2)安装Dart插件

2、安装Dart SDK:

1)Dart SDK通常包含在Flutter SDK中,因此安装Flutter后不需要再单独安装这个了

3、安装flutter SDK:

1)前往 Archive | Flutter 下载安装flutter SDK,按照操作系统指引安装完成

2)将Flutter SDK的 bin 目录添加到系统的 PATH 环境变量中

3)配合环境变量,windows的用户直接在将下面的添加到环境变量中

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

 注意:这两个环境变量一定要加,否则可能导致后面 flutter doctor 命令连接不上服务

(修正:这一步可以不加,这个来源可能在后续运行项目的时候会缺少一些插件依赖之类的,不加这两个环境变量的话需要确保自己的网络能上外网才能配置成功!!!!!!)

4)配置好环境后可以开发cmd,使用命令flutter doctor

上诉命令会检查你的现有环境并将检测结果以报告形式呈现出来

这里是因为我们没有配置好对应的Android开发环境。去配置Android环境

二、配置Android环境

1、下载并安装下载 Android Studio 和应用工具 - Android 开发者  |  Android Developers

安装时会出现以下问题

解决办法:

①点击Setup Proxy

勾选第二个选项 Auto Detect proxy

点击 continue,接着Android Studio会自动设置代理去拉取SDK的列表,问题解决

2、运行Android Studio,并进入设置,配置你想要运行的Android SDK版本。

3、运行 flutter doctor 确保 Flutter 已经定位到了你的 Android Studio 的安装位置。如果 Flutter 并未定位到,运行 flutter config --android-studio-dir <directory> 设置你的 Android Studio 的安装目录。

可以看到Android环境已经配置好了

4、进入Device Manager配置安卓设备

选择x86镜像:点击下载按钮下载

下载完之后选择,再点击next:

配置硬件加速:点击finish

启动模拟器:

三、安装配置visual Studio

1、下载安装

下载 Visual Studio Tools - 免费安装 Windows、Mac、Linux

2、配置

1)确保选择“使用C++的桌面开发”工作负载

  • 在右侧的“安装详情”中,确认以下组件已选中:
    • MSVC v142 - VS 2022 C++ x64/x86 build tools: 安装最新版本的构建工具。
    • C++ CMake tools for Windows: 确保选中。
    • Windows 11 SDK: 确保选中最新版本。

勾选好之后点击开始安装即可

2)再次去运行flutter doctor

如果是打钩就说明安装配置成功啦~

3)额外问题

显示链接不上GitHub,确保自己的网络能上外网

flutter环境就安装成功了~~

四、使用VScode新建flutter程序

1、打开 View > Command Palette

2、输入「flutter」,选择 Flutter: New Project。(注意这一步,会提示你下载flutter SDK,由于我们前面已经下载了,这个地方选择locate SDK,点击之后选择flutter安装目录的bin目录既可能进行下一步选择Application)

3、选择Application

4、新建或选择新项目将存放的上层目录。

5、输入项目名称,例如 my_app,并点击 Enter

6、等待项目创建完成,并且 main.dart 文件展现在编辑器中

也可以用以下方式创建项目:

flutter create 项目名称

flutter run  运行项目

Logo

一站式 AI 云服务平台

更多推荐