必须装Svelte扩展、配svelte.config.js（非空）和tsconfig.json（含types: ["svelte"]及$lib路径），三者缺一不可；否则语法标红、$:无提示、export let无类型、$lib不识别。
装对扩展、配好 svelte.config.js 和 tsconfig.json、手动确认语言模式为 Svelte，三者缺一不可；否则语法标红、$: 无提示、export let 后没类型、$lib 路径不识别——全是表面症状，根子就在这三处。
为什么装了 Svelte for VS Code 还是当 HTML 处理？
VSCode 默认不认 .svelte 文件，扩展必须靠项目里存在 svelte.config.js（哪怕空文件）才激活语言服务。没有它，插件直接降级为纯 HTML 模式。
- 右下角状态栏显示
HTML是最明确的信号；点击它 → 选Svelte→ 勾选Always use Svelte for '.svelte' files - 如果选完又自动回退，立刻检查是否装了冲突扩展：
Svelte Language Server、Svelte Intellisense等——全卸载 - 新建项目务必用
npm create svelte@latest，它自动生成svelte.config.js；手动建项目则需在根目录touch svelte.config.js
tsconfig.json 配错导致 $lib 和全局类型失效
$lib 路径标红、$state 报 Cannot find name '$'，不是插件问题，是 TypeScript 根本没加载 Svelte 类型定义。
-
compilerOptions.types必须包含"svelte"，否则所有 Svelte 全局类型（$derived、$$Props等）都不可见 - 要支持
$lib/Component.svelte，必须在compilerOptions.paths中显式声明："$lib/*": ["src/lib/*"]，且baseUrl设为"." -
include字段必须覆盖.svelte文件，推荐写成["src/**/*"]；只写["src/**/*.ts"]会导致<script>块里的 TS 不被扫描
svelte.config.js 配错让响应式和类型推导全失效
$: 表达式不识别依赖、export let name: string 后没类型提示、组件 props 补全为空——大概率是 svelte.config.js 没启用预处理器或配错类型。
前端设计优化skill
下载
前端设计与 UI/UX 全方位优化专家。覆盖视觉层次、排版系统、色彩理论、响应式布局、交互体验、动画动效、无障碍访问、性能优化八大维度，帮助开发者将普通页面升级为高品质产品级界面。前端设计与 UI/UX 全方位优化专家。覆盖视觉层次、排版系统、色彩理论、响应式布局、交互体验、动画动效、无障碍访问、性能优化八大维度，帮助开发者将普通页面升级为高品质产品级界面。
立即学习“前端免费学习笔记（深入）”；
- 用 TypeScript：必须安装
svelte-preprocess，并在配置中启用：preprocess: sveltePreprocess({ typescript: true }) - 用 SvelteKit：改用
vitePreprocess()（来自@sveltejs/kit），别混用旧版sveltePreprocess - 改完配置后，必须执行
Cmd+Shift+P→Svelte: Restart Language Server；只重启窗口或重装插件没用
调试断点进不了 <script> 块？多半是 sourcemap 路径没对齐
断点停在空白行、或根本不停在 JS 区域，不是代码问题，而是 VSCode 找不到源码映射位置。
-
launch.json中sourceMapPathOverrides必须匹配 Vite 的默认输出规则："webpack:///src/*": "${webRoot}/src/*" - 开发服务器必须先运行（
npm run dev），再按F5启动调试；否则 Chrome 无法连接到http://localhost:5173 - 浏览器地址栏若显示
file://协议，断点一定无效——Vite 必须走 HTTP 协议才能注入 sourcemap
最容易被忽略的是 svelte.config.js 存在但内容为空对象 {}：它能激活语言服务，但不启用任何预处理，TS 类型和响应式推导依然失效。宁可写最简有效配置，也不要留空。
