f11行书签在vue单文件组件中因只认行号不区分区块而易错位，ctrl+f11编号书签跨项目易跳错，shift+f11面板需靠描述字段高效管理，书签与todo机制完全隔离。
F11 行书签在 Vue 单文件组件里怎么用才不丢
Vue 项目里大量使用 .vue 文件，<script></script>、<template></template>、<style></style> 三块逻辑混在同一文件。F11 打的行书签只认行号，不区分区块——你在 <template></template> 里按 F11，删掉上面两行 HTML，书签会跟着下移进 <script></script> 区，甚至跑到注释里去。
- 适合标记“当前正在改的
setup()函数”“待补全的v-model绑定行”，但别指望它长期稳定在某个逻辑块内 - 重命名组件（如
Header.vue→AppHeader.vue）不影响书签，因为 F11 不存文件名 - 关掉文件再打开，书签还在；但 Git 切换分支后如果该行被删或移动，书签就自动消失，不会报错也不会提醒
- 别在
<style scoped></style>里打太多 F11 —— CSS 重构时整块删改太常见，书签存活率极低
Ctrl+F11 编号书签为什么在 Vue 项目里容易跳错
Vue 项目结构深、文件多，Ctrl+F11 打的编号书签（比如 #3）一旦跨项目残留，Ctrl+3 就可能跳到一个已删除的 views/UserList.vue，甚至跳到上个月调试过的旧分支路径里。
- 最常踩的坑：在 A 项目打了
#5标记src/composables/useAuth.ts，转头开 B 项目按Ctrl+5，WebStorm 强行跳回 A 项目的旧路径，而此时 A 项目根本没打开 - 解决方法不是重启 IDE，而是立刻按
Shift+F11，在面板里找到#5对应的旧路径，右键 →Remove；或者直接按Ctrl+Shift+5把它重定位到当前文件的合理位置 - Vue Router 的
router/index.ts、Pinia 的store/index.ts这类入口文件，建议固定用#0和#1，避免每次重打 - 别用字母
a–z做高频书签——Mac 上Cmd+a是全选，Cmd+b是加粗，容易误触
Shift+F11 面板在 Vue 项目里怎么看才高效
Shift+F11 面板列出所有书签，但在 Vue 项目里它不识别 <script setup></script> 语法块边界，也不按 <template></template> / <script></script> 分组，所有行都平铺显示，靠手动展开文件夹找。
- 面板里的路径是绝对路径，重命名
components/文件夹后，旧书签仍显示原路径，双击会提示 “File not found”，得手动删 - 描述字段（Description）一定要写，比如
#2: useFetch loading 状态处理，而不是#2: loading——Vue 里到处都是 loading，光看缩写根本分不清 - 面板不支持按
ref()、computed()等关键词搜索，只能靠描述字段匹配，所以描述里建议带函数名或响应式变量名 - 右键菜单里的
Remove All Bookmarks只清普通书签（F11），不会动编号书签（Ctrl+F11），这点容易误判
Vue 项目中书签和 TODO 工具窗口根本不是一回事
很多人把 // TODO 注释和书签混用，但在 Vue 项目里这俩机制完全隔离：书签锚定物理行号，TODO 扫描语义注释。
- 你在
<script setup></script>里写了// TODO: 处理 401 跳转，IDE 自动加进 TODO 工具窗口；但删掉这行，书签（哪怕在同一行）不会受影响 - 把
defineProps那行打了个 F11，之后改成const props = defineProps(...)，只要没删整行，书签还在；但 TODO 不会因为你改了写法就自动关联过去 - 书签存在
.idea/workspace.xml，Git 默认忽略；TODO 列表是实时扫描生成的，换机器打开项目立刻能用 - 重构
<template></template>时拖动整段 HTML，F11 书签会跟着走；但// TODO如果被剪切到新位置，原处消失，新位置不会自动变成 TODO 条目
Vue 项目越复杂，书签越容易变成“幽灵导航点”——看着图标还在，点进去却是空行或错误上下文。关键不是打得够不够多，而是每次切换分支、重命名文件、升级 Vue 版本后，花 30 秒按 Shift+F11 清一遍失效项，比事后花 10 分钟找错行更省事。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
