vscode 中 $state 等 svelte 响应式声明无提示，根本原因是语言模式未设为 svelte、svelte.config.js 缺失或配置错误、tsconfig.json 未包含 .svelte 文件及 svelte 类型、vitepreprocess() 未正确使用。
VSCode 本身不提供 Svelte 专属的 reactive 声明快捷键，$state、$derived、$effect 等不是靠 Tab 补全出来的，而是靠语言服务器在正确配置下自动提示 + 手动输入触发补全 —— 这一点和 React 的 useState 完全不同。
为什么敲 $state 没提示？先确认语言服务是否激活
常见现象：光标停在 <script></script> 块里，输入 $s，无任何补全弹出；右下角状态栏显示 “HTML” 或 “Plain Text”。这不是插件没装，是 VSCode 根本没把当前文件当 Svelte 处理。
- 点击右下角语言模式（如显示 “HTML”），选 “Svelte”，再点齿轮 → “Configure File Association for '.svelte'” → 绑定到
svelte - 项目根目录必须存在
svelte.config.js（哪怕只写export const config = {};） - 执行
Cmd+Shift+P→ 输入Svelte: Restart Language Server（仅 Reload Window 不生效）
$state 补全失效的真正原因：TS 类型未加载
即使语言模式正确，$state 仍标红或无提示，大概率是 TypeScript 服务没识别 .svelte 中的脚本块。VSCode 默认只扫描 .ts 文件，不会主动解析 <script></script> 里的 TS 内容。
-
tsconfig.json的include必须显式覆盖.svelte："include": ["src/**/*"]（不能写["src/**/*.ts"]） - 必须声明 Svelte 全局类型：
"types": ["svelte"]加入compilerOptions - 若用
$lib别名，compilerOptions.paths要配"$lib/*": ["src/lib/*"]，且baseUrl设为"."
真正能提速的快捷操作：不是生成，而是快速插入 + 自动修正
你不需要“生成” $state，但可以极快地把它写出来并让类型立刻就位 —— 关键在触发智能补全和快速修复。
- 在
<script></script>块中输入$st，按Ctrl+Space（macOSCmd+Space）手动唤出补全列表，选$state - 写完
let count = $state(0)后，若标红，按Ctrl+.（macOSCmd+.）调出快速修复，它会自动补全import { $state } from 'svelte/reactivity'（前提是配置正确） - 对已声明变量快速转为响应式：选中
count→Ctrl+Shift+P→ 输入 “Svelte: Convert to $state”，部分插件支持此命令（需启用 Svelte 插件 v3.10+）
最常被忽略的一点：所有这些快捷行为的前提，是 svelte.config.js 里用了 vitePreprocess() 而不是 sveltePreprocess() —— 错用后者会导致整个 <script></script> 块被跳过类型检查，补全自然失效，且无法通过重启解决。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
