vs code 正确识别 html 文件需三步：确保文件扩展名为 .html 并保存，右下角点击语言模式选择“configure file association for '.html'”并设为 html，检查 settings.json 中 files.associations 无误配；否则将导致标签不闭合、属性无提示、emmet 失效等问题。
VS Code 不是“配置好就能写 HTML”，而是必须明确三件事：文件被识别为 HTML、保存后能实时看到效果、改错时有即时反馈。其他全是锦上添花。
怎么让 VS Code 正确识别 .html 文件
常见错误现象：输入 <div> 没自动闭合，<code>class 属性没提示，右下角状态栏显示 Plain Text 而不是 HTML。
- 点击右下角语言模式（如 Plain Text），选择 “Configure File Association for '.html'” → 选 HTML
- 若已关联但无效，检查
settings.json中是否有误配的files.associations，比如把"*.htm"错写成"*.html"或反过来 - 新建文件后务必先保存为
index.html（扩展名不能漏），否则 VS Code 默认按纯文本处理
为什么双击打开 HTML 页面不刷新、API 报错
直接双击或拖入浏览器，地址栏是 file:///xxx/index.html，这会导致两个硬伤：fetch 读本地 JSON 失败、navigator.geolocation 被拒绝、Live Preview 插件失效。
- 必须用 HTTP 协议访问——装
Live Server（作者 Ritwick Dey），右键 HTML 文件 →Open with Live Server - 此时地址变为
http://127.0.0.1:5500/index.html，所有现代 Web API 才能正常调用 - 别用
Open in Browser插件替代 Live Server：它只是模拟双击，仍走file://协议
Emmet 写 ! 不生成骨架？
输入 ! 后按 Tab 没反应，或生成的是旧版 HTML4 结构，说明 Emmet 在 HTML 上下文里没激活。
html-to-pptx-converter
下载
使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。
- 确认当前文件语言模式是 HTML（右下角显示）
- 打开
settings.json，检查emmet.includeLanguages是否为："emmet.includeLanguages": {"html": "html"}（注意是对象，不是数组） - 别写成
"emmet.includeLanguages": ["html"]—— 这个写法只对部分旧版本生效，新版会忽略 - 如果用了自定义后缀（如
.tpl），需额外加一行："*.tpl": "html"到files.associations
HTML 格式化后标签乱序、属性换行崩坏
开启 editor.formatOnSave 后，<input type="text" id="name" required> 可能被拆成四行，或 required 跑到下一行，影响可读性。
- 在
settings.json中添加："html.format.wrapAttributes": "auto"（默认是force） - 禁用对内联脚本/样式的格式化：
"html.format.contentUnformatted": ["pre", "code", "textarea", "script", "style"] - 若用 Prettier，必须设
"editor.defaultFormatter": "esbenp.prettier-vscode"，否则 VS Code 内置格式化器和 Prettier 会冲突
最容易被忽略的一点：Live Server 启动后端口是随机的（如 5500、5501），但如果你手动改过 liveServer.settings.port，又忘了删掉注释或配错值，就可能卡在 “Starting Live Server…” 无响应——这时候关掉 VS Code 全进程再重开，比查日志更快。
