vs code中div.container按tab无反应，首要检查右下角语言模式是否为html；若为plain text需手动设为html，.vue文件仅区生效，且缩写不可含空格或换行。
VS Code 里输入 div.container 按 Tab 没反应？先看语言模式
VS Code 自带 Emmet，但不会自动识别所有文件为 HTML。新建未保存的文件默认是 Plain Text，此时任何缩写都无效。
必须确保右下角状态栏显示 HTML——点击它 → 选 Configure File Association for '.txt' → 设为 HTML；或者直接保存为 index.html，VS Code 就会自动切换。
- 在
.js或.ts文件里写div.test，默认不触发：需在settings.json中加"emmet.includeLanguages": {"javascript": "html"} - 在
.vue文件中，仅<template></template>区域生效；<script setup></script>里写缩写会被忽略 - 缩写中间有空格（如
div .container）或换行，Emmet 直接静默跳过，不报错也不展开
Atom 中 Emmet 装完没反应？重启 + 切语法是硬门槛
Atom 的 Emmet 插件（作者必须是 emmetio）装完不重启 = 白装。插件只加载一半，Emmet: Expand Abbreviation 命令会报 Cannot read property 'expand' of undefined。
重启后，打开新文件，右下角手动点成 HTML，再输 div.test，光标停末尾按 Tab —— 成功才说明真正就绪。
Article To Html
下载
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
- 在
.jsx或.vue里用，进Packages → emmet → Settings → Extensions，填jsx: jsx, vue: html - 若仍无效，检查
keymap.cson是否漏配：'.source.js, .source.jsx':\n 'tab': 'emmet:expand-abbreviation' -
div[style=margin:10px]是错的；正确写法是div{style="margin:10px"}，属性必须包在{}里且带引号
!、ul>li*3、section#main.col-8 这些缩写为什么有时失效？
不是语法记错了，而是触发条件被破坏。Emmet 对上下文非常敏感：
-
!必须独占一行且光标在行首，按Tab；写成p{!}或换行后跟内容，都不展开 -
ul>li*3若写在 JS 字符串里（如const html = "ul>li*3"），或<script></script>块内，Emmet 不处理 -
section#main.col-8中的.和#前不能有空格；section #main会被当作文本原样保留 -
img[src=logo.png][alt=Logo]属性间不能有空格；img[src=logo.png] [alt=Logo]失效
Vue/JSX 中 class 名展开成 className 而不是 class？这是设计行为
Emmet 在 JSX 上下文中（比如 .jsx 或启用了 javascriptreact 语言映射的文件）默认生成 className，不是 bug，是 React 规范要求。
如果你在纯 HTML 环境下误用了 JSX 语言模式，就会看到 className；反过来，在 JSX 里想强制用 class，得显式写 div[class="test"]。
- Vue 单文件中，
<template></template>内始终走 HTML 模式，div.test展开为class="test" - JSX 里
div.test默认变className="test"；改这个行为要覆盖 Emmet 行为，不推荐 - 真正容易被忽略的是：Emmet 不校验属性是否存在，
div[nonexist=123]也会照常展开，但浏览器不认
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
