Flutter 环境搭建实录

Flutter环境搭建日志记录了我在 Windows 10 系统上从零开始配置 Flutter 开发环境的完整过程。期间遇到了网络连接、环境变量、sdk下载、Android Studio 配置等一系列问题最终全部解决。️ 我的电脑配置硬件配置操作系统Windows 10 专业版 64位 (22H2)CPUIntel Core i7-8700 3.20GHz (6核12线程)内存16.0 GB硬盘512GB SSD可用空间约262GB显卡Intel UHD Graphics 630 需要安装的软件清单软件用途VS Code代码编辑器写 Flutter 代码的地方Flutter SDKFlutter 核心开发工具包Dart SDK随 Flutter SDK 一起安装Android Studio提供 Android SDK 和模拟器不一定要用来写代码GitFlutter SDK 依赖 Git 进行版本管理已安装省略这一步 快速配置清单步骤操作备注1安装 VS Code官网下载2安装 Flutter 核心插件VS Code 扩展商店3安装 Android Studio官网下载4验证环境flutter doctor -v1.安装 VS Code直接官网下载按照官网的步骤安装就好了配置用户设置文件settings.json文件在 VS Code 中按下快捷键Ctrl Shift P在弹出的输入框中输入Preferences: Open Settings (JSON)点击它打开文件在打开的settings.json文件中找到“dart.flutterSdkPath”这一项。如果不存在就手动添加。将“dart.flutterSdkPath”的值改成你的 Flutter SDK 存放的实际路径{ dart.flutterSdkPath: D:\\flutter }2.安装 Flutter 插件核心插件VS Code 扩展商店中搜索 “flutter”点击安装由官方发布的flutter插件(自动安装Dart插件)下载完成后会弹出一个提示The Flutter SDK was downloaded. Would you like to add it to your PATH?点击了Add SDK to PATH那么它会自动帮你配置好环境变量PATH添加D:\flutter\bin推荐同时安装Flutter Widget Snippets插件下载时发现初始化非常缓慢点击 “Cancel” 按钮重新打开 VS Code在终端输入命令flutter doctor -v这一步操作的是手动运行 flutter doctor-v是 verbose详细模式会打印出进度信息问题分析VS Code 在尝试从pub.dev下载依赖时遇到了网络问题socket error此时我想验证一下电脑上到底有没有装好 flutter sdk打开D盘查看flutter/bin文件夹下有flutter.batSDK 文件在打开CMD窗口验证输入以下命令flutter --version问题分析你的网络无法正常访问pub.dev Flutter 的官方包仓库导致flutter --version卡在下载依赖这一步。按Ctrl C终止检查vpn是否关闭然后临时设置国内镜像仅当前窗口有效在CMD输入命令一行一行地输入并回车set PUB_HOSTED_URLhttps://pub.flutter-io.cn set FLUTTER_STORAGE_BASE_URLhttps://storage.flutter-io.cn flutter --versionFlutter 从国内的镜像站下载依赖速度快了很多不会再出现socket error的错误以下命令在CMD中操作是一行一行地输入并回车set PUB_HOSTED_URLhttps://pub.flutter-io.cn set FLUTTER_STORAGE_BASE_URLhttps://storage.flutter-io.cn flutter --version flutter doctor -v以下命令在VS Code的终端操作是一行一行地输入并回车$env:PUB_HOSTED_URLhttps://pub.flutter-io.cn $env:FLUTTER_STORAGE_BASE_URLhttps://storage.flutter-io.cn flutter --version flutter doctor -v好的重新回到VS Code的终端窗口 诊断结果解读检查项状态说明Flutter SDK✅ 完美已正确安装并使用了国内镜像网络配置很棒。Windows 系统✅ 完美符合所有开发要求。Chrome 浏览器✅ 完美可以立即进行 Web 应用开发。Android 工具链❌ 缺失这是主要问题需要安装 Android Studio 来提供 SDK 和模拟器。Visual Studio⚠️ 组件缺失只影响 Windows 桌面应用开发可以先不管。网络资源⚠️ 连接超时检查 GitHub 时超时不影响国内镜像的使用。3.安装 Android Studio直接官网下载按照官网的步骤安装就好了安装完成在vs code终端再次查看还缺少哪些开发必备的组件$env:PUB_HOSTED_URLhttps://pub.flutter-io.cn $env:FLUTTER_STORAGE_BASE_URLhttps://storage.flutter-io.cn flutter doctor -v 诊断结果解读检查项状态说明Flutter SDK✅ 完美已正确安装镜像配置成功Windows 系统✅ 完美符合所有要求Chrome✅ 完美可进行 Web 开发网络资源✅ 完美所有资源可访问Android 工具链⚠️ 两个小问题缺少 cmdline-tools 许可证未同意Visual Studio⚠️ 组件缺失只影响 Windows 桌面应用可暂缓安装 cmdline-tools打开 Android Studio 的 SDK Manager切换到 SDK Tools 选项卡勾选 Android SDK Command-line Tools (latest)点击Apply按钮在弹出的确认对话框中点击 OK下载完成后点击 Finish同意 Android 许可证在 VS Code 终端中运行$env:PUB_HOSTED_URLhttps://pub.flutter-io.cn $env:FLUTTER_STORAGE_BASE_URLhttps://storage.flutter-io.cn flutter doctor --android-licenses然后一路输入yyes直到所有许可证都同意完毕。4.最后验证 诊断结果解读检查项状态说明Flutter SDK✅ 完美版本 3.44.6镜像配置成功Windows 系统✅ 完美符合所有要求Android 工具链✅已修复SDK 已安装所有许可证已同意Chrome✅ 完美可进行 Web 开发Connected Device✅ 完美可运行在 Windows、Chrome、EdgeNetwork Resources✅ 完美所有网络资源可访问Visual Studio⚠️ 可忽略仅用于 Windows 桌面应用开发建议分享国内网络环境一定要配置镜像这是最关键的一步否则各种超时错误会让你崩溃不要同时开 VPN配置了国内镜像后直连反而更快环境变量配置后记得重启 VS Code否则终端不会生效遇到报错先看红色文字90% 的问题都写在了报错信息里现在环境已经就绪接下来就可以正式学习 Flutter 开发了如果这篇文章对你有帮助欢迎收藏或分享给其他正在搭建 Flutter 环境的朋友。祝编码愉快