需先安装 dart 和 flutter sdk 并配置 path，再安装 dart code 与 flutter 官方扩展，启用 lsp；接着用 flutter create 创建项目并在 vscode 中打开，选择设备后 cmd+enter 启动调试，支持断点、热重载（cmd+s）和热重启（cmd+shift+h），还可自定义代码片段提升效率。
如果您希望在 visual studio code 中高效开发 dart 和 flutter 应用，则需要正确配置编辑器环境、安装必要扩展并掌握核心工作流。以下是实现这一目标的具体步骤：
本文运行环境：MacBook Air，macOS Sequoia
一、安装 Dart 和 Flutter SDK
VSCode 本身不包含 Dart 或 Flutter 运行时，必须先在系统中安装官方 SDK，才能启用语法支持、调试和热重载功能。
1、访问 https://flutter.dev/docs/get-started/install，下载对应 macOS 的 Flutter SDK 压缩包。
2、解压至 /Users/yourname/development/flutter 目录（路径中不得含空格或中文）。
3、将 flutter/bin 和 flutter/bin/cache/dart-sdk/bin 添加至系统 PATH 环境变量。
4、在终端执行 flutter doctor，确认所有依赖项状态为绿色对勾。
二、配置 VSCode 扩展与设置
VSCode 需通过扩展获取 Dart/Flutter 特定能力，包括代码补全、跳转定义、格式化及设备选择等功能。
1、打开 VSCode，进入扩展视图（快捷键 Cmd+Shift+X）。
2、搜索并安装官方扩展：Dart Code 和 Flutter（均由 Dart-Code 团队发布）。
3、重启 VSCode 后，在命令面板（Cmd+Shift+P）中输入 Dart: Open Extension Log，验证扩展已激活。
4、在设置中启用 dart.previewLsp 并设为 true，以启用基于 LSP 的语言服务。
三、创建并运行首个 Flutter 项目
使用命令行初始化项目可确保工程结构完整，并自动关联 VSCode 工作区配置。
1、在终端中执行 flutter create my_first_app，生成标准项目模板。
2、在 VSCode 中通过 File → Open Folder 打开该目录。
3、等待右下角状态栏显示 No Devices，点击后选择已连接的 iOS 模拟器或 Android 设备。
4、按下 Cmd+Enter（或点击侧边栏“Run and Debug”中的绿色三角形），启动调试会话。
四、调试与热重载操作
VSCode 提供原生集成调试界面，无需切换终端即可完成断点设置、变量检查与 UI 实时更新。
1、在 lib/main.dart 文件中，点击行号左侧空白处设置断点。
2、启动调试后，程序将在断点处暂停，右侧“VARIABLES”面板显示当前作用域变量值。
3、修改 Widget 树中的文本内容，保存文件（Cmd+S），观察模拟器中界面即时刷新。
4、若需完整重建 UI，按 Cmd+Shift+H 触发热重启（Hot Restart）。
五、自定义代码片段与快捷键
通过用户代码片段可快速插入常用 Dart/Flutter 结构，减少重复书写，提升编码一致性。
1、打开命令面板，输入 Preferences: Configure User Snippets，选择 Dart。
2、在打开的 dart.json 文件中添加新片段，例如 stless 对应 StatelessWidget 模板。
3、定义 body 字段为："return Scaffold(body: Center(child: Text('$1')));"。
4、保存后，在 .dart 文件中输入 stless 并按 Tab 键，即可展开完整结构。
