autocomplete-paths 不补全子目录图片因其默认仅扫描根目录下一级文件,非 bug 而是设计限制;需通过 projectHome 配置或调整资源位置解决。

autocomplete-paths 为什么补不全子目录里的图片?
因为 autocomplete-paths 默认只扫描项目根目录下一级的文件(比如 logo.png、index.html),它不会递归进 assets/images/ 或 src/img/ 这类嵌套路径——这不是 bug,是设计如此。
- 把图片直接扔进项目根目录(适合快速原型,改完就能
src="icon.jpg"补全) - 手动在
config.cson中设置core.projectHome指向含资源的父级路径,例如:core:<br> projectHome: "/Users/me/my-website"
(确保该路径下有assets/或images/) - 别指望
fuzzy-finder或tree-view开启后就能补全src属性——它们管文件跳转,不管 HTML 属性值里的路径
装了 autocomplete-paths 却没反应?检查这三件事
常见现象:敲 src=" 或 href=" 后毫无提示,光标静止不动。
- 确认当前文件是 HTML / CSS / JS 类型(右下角状态栏显示
text.html.basic等),不是纯文本(text.plain) - 检查是否被其他插件干扰:比如同时装了
emerald-html和默认language-html,可能触发语法作用域冲突,导致路径提供者不激活 -
autocomplete-paths默认只对src、href、data-src、background等有限属性生效;写custom-path="./xxx"不会触发补全
和 atom-html-preview / live-server 冲突怎么办?
不冲突,但容易误判:路径补全是编辑时行为,预览是运行时行为,二者逻辑分离。真正出问题的是你一边用 atom-html-preview 右键打开,一边又跑 npx live-server —— 这会导致浏览器加载旧缓存或空白页,让你怀疑“是不是路径没补全对”。
- 禁用
atom-html-preview(它只是快照,改完要手动刷新) - 终端进项目根目录,运行
npx live-server --port=8080 - 配合
open-in-browser插件,按ctrl+alt+l直达http://127.0.0.1:8080 - 此时补全的路径是否正确,直接看浏览器 Network 面板里
img请求的 URL 就行
比 autocomplete-paths 更稳的替代方案?
如果你常写 Vue/React/JSX,或需要深度路径感知(比如自动识别 @/assets/ 别名),autocomplete-paths 就力不从心了——它没有解析构建配置的能力。
- 纯静态站点:坚持用它 +
projectHome配置,轻量无负担 - Webpack/Vite 项目:别白费劲配它,改用命令行校验更实在:
npx html-validate index.html查路径是否存在 - 真要动态感知:放弃 Atom,换 VS Code +
Path Intellisense(支持jsconfig.json和别名映射)
Atom 的路径补全本质是“字典式静态扫描”,不是语言服务。想让它理解 import { X } from '@/utils',等于让算盘跑 Docker。

















