《一个IDE走天下》Vscode开发Flutter

ESJIAN

作为Windows应用运行
- 进入任意一个Flutter应用
- 进行Cmake准备：在终端输入flutter build windows
- 进行Cmake配置（Kit配置+launch/debug target配置）
  - 按住ctrl+shift+p打开命令面板后输入cmake:configure显示如下
  - 输入camke:configure后回车会跳出一个kit选择界面(或以命令>cmake:select a kit打开选择)，弹窗显示如下，此处我们选择Visual Studio Community 2022 Release - amd64。原因见链接
  - 在后续如下的弹窗中选择带install项(或以命令cmake:set launch/debug target打开)。原因见链接
- 进行构建运行操作
  - 点击IDE左下角的Build按钮进行构建
  - 点击IDE左下角的运行按钮进行预览
  - 点击IDE左下角的Debug按钮进行Debug

【注意事项】

【问题集锦】

问题描述：运行flutter pub get 长时间无反应
问题分析：可能与管理flutter的 maven有关系，因为flutter默认的maven源在国外，需要开启梯子
方案尝试：开梯子；尝试方案Flutter更改国内镜像资源_flutter 镜像源-CSDN博客
方案验证：命令能够得到有效反应

问题描述：无法通过Windows应用进行调试
问题分析：终端运行flutter doctor，报错日志如下如下
问题诊断：Visual Studio Installer没有安装完全适用于Windows桌面开发的C/C++组件
方案尝试：补全没有安装的桌面开发组件
方案验证：doctor检查通过

问题描述：启动终端报错，报错 No CMAKE_CXX_COMPILE

问题分析：可能与你没有安装cmake有关，或者是CmakeList.txt中指代的C++编译器环境不对
问题诊断：终端输入camke --version，发现终端报错找不到命令

方案尝试：在CmakeList增加一行代码指代Cmake使用的编译器路径；

# Project-level configuration.

cmake_minimum_required(VERSION 3.14)

set(CMAKE_CXX_COMPILER "E:/mingw64/bin")
# E:/mingw64/bin是你安装编译器bin的绝对目录地址
project(swithing_maid LANGUAGES CXX)

方案验证：选择Windows/flutter/cmakelist.txt

发现终端报错ABI错误

[cmake] -- Detecting CXX compiler ABI info

[cmake] -- Detecting CXX compiler ABI info - failed

[cmake] -- Check for working CXX compiler: E:/mingw64/bin

[cmake] -- Check for working CXX compiler: E:/mingw64/bin - broken

问题再描述：ABI错误，联想到官方指导中默认是用MSVC+WinSDK配置的，所以我猜测此处如果使用MinGW作为编译器，可能会产生兼容性错误。所以我认为此处不应该手动改动其默认制定的编译器。然后去Visual Studio Installer中发现，只安装了MSVC v143，而Win10 SDK没有安装，如下图所示。

方案再尝试：勾选安装Windows10SDK(10.0.0.20348.0)
方案再验证：如图一所示，打开Flutter项目Windows目录下的CmakeList.txt然后在界面中按下Ctrl+s进行保存,观看终端输出日志。若为输出第二幅图所示，则ABI问题解决

<center>图2：终端输出</center>
【参考链接】

问题描述：点击StartDebugging 按钮后，过了一段时间无任何控制台应用被唤起

进入程序输出目录手动执行程序发现报错丢失flutter_windows.dll

问题分析：可能是由于FlutterSDK安装缺失造成的，下面尝试重新安装FlutterSDK
方案尝试：
从自己项目中查看适合自己的FlutterSDK版本

到Archive | Flutter中去下载符合自己版本的DartSDK，根据前面所得至少大于3.70，此处我下载3.29.0-0.2.pre（需梯子）

解压文件到原有的SDK所在目录进行覆盖
方案验证：问题依旧仍然控制台无法唤起被调试的应用
问题再分析：上述运行终端日志无报错，但是手动执行报丢失。怀疑非本身问题，而是运行时配置问题，在后续的排查中发现编译调试得从Camke扩展中提供的选项去执行，而非IDE提供的运行调试按钮。
方案再尝试：在进行调试操作时点击图中所示可以点击的按钮
方案再验证：无法唤起调试应用的问题解决

<center>图：成功唤起调试应用示意图</center>

<center>图：唤起成功后的调试目录文件结构</center>

问题描述：进行Build时终端报错，终端输出日志如下

Generating C:/Users/Administrator/Documents/CODE/VsCode/Flutter/ai-teach-web/windows/flutter/ephemeral/flutter_windows.dll, C:/Users/Administrator/Documents/CODE/VsCode/Flutter/ai-teach-web/windows/flutter/ephemeral/flutter_export.h, C:/Users/Administrator/Documents/CODE/VsCode/Flutter/ai-teach-web/windows/flutter/ephemeral/flutter_windows.h, C:/Users/Administrator/Documents/CODE/VsCode/Flutter/ai-teach-web/windows/flutter/ephemeral/flutter_messenger.h, C:/Users/Administrator/Documents/CODE/VsCode/Flutter/ai-teach-web/windows/flutter/ephemeral/flutter_plugin_registrar.h, C:/Users/Administrator/Documents/CODE/VsCode/Flutter/ai-teach-web/windows/flutter/ephemeral/flutter_texture_registrar.h, C:/Users/Administrator/Documents/CODE/VsCode/Flutter/ai-teach-web/windows/flutter/ephemeral/cpp_client_wrapper/core_implementations.cc, C:/Users/Administrator/Documents/CODE/VsCode/Flutter/ai-teach-web/windows/flutter/ephemeral/cpp_client_wrapper/standard_codec.cc, C:/Users/Administrator/Documents/CODE/VsCode/Flutter/ai-teach-web/windows/flutter/ephemeral/cpp_client_wrapper/plugin_registrar.cc, C:/Users/Administrator/Documents/CODE/VsCode/Flutter/ai-teach-web/windows/flutter/ephemeral/cpp_client_wrapper/flutter_engine.cc, C:/Users/Administrator/Documents/CODE/VsCode/Flutter/ai-teach-web/windows/flutter/ephemeral/cpp_client_wrapper/flutter_view_controller.cc, _phony_

问题分析：按住ctrl左键每一个文件发现都是缺失的，说明Cmake前提准备没有做，这个时候在终端输入flutter build windows后回车即可

方案尝试：打开IDE的终端，输入flutter build windows，命令输出如下

PS C:\Users\Administrator\Documents\CODE\VsCode\Flutter\ai-teach-web> flutter build windows
Resolving dependencies... (1.1s)
Downloading packages... 
* args 2.6.0 (was 2.6.0)
* async 2.12.0 (was 2.11.0)
* boolean_selector 2.1.2 (was 2.1.1)
* characters 1.4.0 (was 1.3.0)
* clock 1.1.2 (was 1.1.1)
* collection 1.19.1 (was 1.18.0)
* crypto 3.0.6 (was 3.0.6)
* cupertino_icons 1.0.8 (was 1.0.8)
* fake_async 1.3.2 (was 1.3.1) (1.3.3 available)   
* ffi 2.1.3 (was 2.1.3)
* flutter_lints 4.0.0 (was 4.0.0) (5.0.0 available)
* flutter_markdown 0.6.23 (was 0.6.23) (0.7.6 available)
* getwidget 2.1.1 (was 2.1.1) (5.0.0 available)
* google_fonts 6.2.1 (was 6.2.1)
* http 1.3.0 (was 1.2.2)
* http_parser 4.1.2 (was 4.0.2)
* leak_tracker 10.0.8 (was 10.0.5) (10.0.9 available)   
* leak_tracker_flutter_testing 3.0.9 (was 3.0.5)        
* leak_tracker_testing 3.0.1 (was 3.0.1)
* lints 4.0.0 (was 4.0.0) (5.1.1 available)
* markdown 7.3.0 (was 7.2.2)
* matcher 0.12.17 (was 0.12.16+1)
* material_color_utilities 0.11.1 (was 0.11.1) (0.12.0 available)
* meta 1.16.0 (was 1.15.0)
* nested 1.0.0 (was 1.0.0)
* path 1.9.1 (was 1.9.0)
* path_provider 2.1.5 (was 2.1.5)
* path_provider_android 2.2.15 (was 2.2.15)
* path_provider_foundation 2.4.1 (was 2.4.1)
* path_provider_linux 2.2.1 (was 2.2.1)
* path_provider_platform_interface 2.1.2 (was 2.1.2)
* path_provider_windows 2.3.0 (was 2.3.0)
* phosphor_flutter 2.1.0 (was 2.1.0)
* platform 3.1.6 (was 3.1.6)
* plugin_platform_interface 2.1.8 (was 2.1.8)
* provider 6.1.2 (was 6.1.2)
< sky_engine 0.0.0 from sdk flutter (was 0.0.99 from sdk flutter)
* source_span 1.10.1 (was 1.10.0)
* stack_trace 1.12.1 (was 1.11.1)
* stream_channel 2.1.4 (was 2.1.2)
* string_scanner 1.4.1 (was 1.2.0)
* term_glyph 1.2.2 (was 1.2.1)
* test_api 0.7.4 (was 0.7.2)
* typed_data 1.4.0 (was 1.4.0)
* vector_math 2.1.4 (was 2.1.4)
* vm_service 14.3.1 (was 14.2.5) (15.0.0 available)
* web 1.1.0 (was 1.1.0)
* xdg_directories 1.1.0 (was 1.1.0)
Changed 48 dependencies!
8 packages have newer versions incompatible with dependency constraints.
Try `flutter pub outdated` for more information.

Building Windows application...                                    58.7s
√ Built build\windows\x64\runner\Release\untitled1.exe

方案验证：点击编译器左下角的运行按钮，发现能够成功调试，显示效果如下