VSCode不能直接运行微信小程序，需依赖微信开发者工具编译预览调试；必须保存文件、配置project.config.json和@types/wechat-miniprogram类型库，并对TS等源码手动编译。
VSCode 能不能直接运行微信小程序
不能。VSCode 本身不支持编译、预览或真机调试微信小程序，它只是个编辑器——真正干活的是微信开发者工具。你用 VSCode 写代码，但必须靠微信开发者工具来构建、模拟、调试和上传。
常见错误现象：app.json not found 或 Failed to load script，往往是因为项目根目录没被微信开发者工具正确识别，或者 VSCode 里改了文件但没保存（微信工具不会自动监听未保存的变更）。
使用场景：日常开发中，你大概率会用 VSCode 编辑 pages、components、app.js 等源码，再切到微信开发者工具看效果、查 console、设断点。
实操建议：
- 确保项目根目录下有
project.config.json，且其中miniprogramRoot字段值为./或子路径（如./src/），微信工具靠它定位小程序源码位置 - VSCode 中务必手动 Ctrl+S（Win） / Cmd+S（Mac） 保存文件，微信开发者工具默认只读取已保存的磁盘文件
- 如果用了 TypeScript 或 Sass，需额外配置构建流程（见下一条）
为什么改了 .ts 文件，微信开发者工具不生效
因为微信原生框架只认 .js、.wxml、.wxss，不解析 TypeScript、Less、Pug 等源码。VSCode 里写 index.ts 没问题，但必须先编译成 index.js，微信工具才能加载。
性能 / 兼容性影响：手动生成易漏、易错；用监听式构建（如 tsc --watch）能省事，但若项目大、依赖多，首次编译慢，且可能因路径别名（paths）导致输出错位。
实操建议：
- 初始化时就在项目根运行
tsc --init，并确保compilerOptions.outDir指向小程序源码目录（如"miniprogram"），且include包含"miniprogram/**/*.ts" - 在 VSCode 的
tasks.json中配置shell类型任务，命令填npx tsc -w，启用“运行任务时在后台持续执行” - 避免在
miniprogram目录内混写.ts和.js，否则微信工具可能加载旧的.js而忽略新编译结果
如何让 VSCode 正确识别 App、Page、Component 等全局函数
VSCode 默认不知道这些是微信小程序的 API，所以没有类型提示、参数校验和跳转支持，写 Page({ data: { a: 1 } }) 时连 data 字段都标红。
使用场景：补全失效、ctrl+click 跳不到定义、hover 看不到参数说明，本质是缺少类型声明。
实操建议：
- 在项目根目录安装微信官方类型库：
npm install --save-dev @types/wechat-miniprogram - 确认
tsconfig.json中types字段包含"wechat-miniprogram"，例如："types": ["wechat-miniprogram"] - 如果用了自定义构建（如 webpack + mini-program-webpack-plugin），需额外配置
resolve.alias映射~到miniprogram目录，否则类型推导会断
微信开发者工具报 WAService.js:1 Uncaught TypeError 怎么快速定位
这类错误通常不是语法错，而是运行时上下文异常，比如在 onLoad 里访问了还没初始化的 this.data，或异步回调中用了已销毁页面的 this.setData。
容易踩的坑：错误堆栈指向 WAService.js，看起来像框架问题，实际 90% 是你代码里某处 this 指向错、生命周期钩子调用时机不对、或 setData 数据结构非法（如传了 undefined）。
实操建议：
- 打开微信开发者工具的“调试器 → Console”，勾选
Pause on caught exceptions，让 JS 在抛错瞬间中断，直接看到哪行触发 - 检查出问题的页面对应的
Page构造函数中，是否在onLoad前就调用了this.setData（这是禁止的） - 用
console.log(JSON.stringify(obj))替代console.log(obj)查对象，避免闭包里看到的已是修改后状态
