🧑🏻‍💻 博世

vscode实用技巧

🇨🇳每日一言:

## 历史的发展是不以人的意志为转移的—— 毛泽东

💯 核心快捷键:

掌握快捷键是进阶的第一步: |功能| 快捷键 (Windows/Linux) |快捷键 (macOS) |描述| |—|—|—|—| |万能命令面板 |Ctrl + Shift + P |Cmd + Shift + P |查找执行 |VS Code 的所有命令 |快速打开文件 |Ctrl + P| Cmd + P |输入文件名|直接跳转| |多光标编辑 |Alt + 点击|Opt + 点击 |在多个位置同时输入| |批量选中相同词| Ctrl + D| Cmd + D| 依次选中下一个相同的单词| |快速跳转行| Ctrl + G |Ctrl + G| 输入行号直接定位| |拆分编辑器 |Ctrl +   |Cmd +   |垂直/水平分屏对比代码| |打开内置终端 |Ctrl + | Ctrl + |无需切换窗口直接跑脚本| | ## 💯 深度进阶技巧 ### 👽符号与结构搜索 文件内符号查找:按 Ctrl + Shift + O,输入 @ 可以列出当前文件的所有函数、类和变量。

全局符号查找:按 Ctrl + T,可以跨文件搜索整个项目中的类或方法名。

👽Emmet 高效编写 HTML/CSS

在 HTML 文件中输入 ul>li*5 然后按 Tab,会自动生成包含 5 个列表项的结构。VS Code 原生支持 Emmet,几乎所有前端布局都能通过“缩写”快速生成。

👽自定义代码片段 (User Snippets)

如果你经常写重复的代码块(如 React 组件模版),可以通过 File > Preferences > User Snippets 创建自定义触发词。例如输入 clg 自动补全为 console.log()。

👽禅模式 (Zen Mode)

通过 Ctrl + K, Z 进入禅模式。它会隐藏侧边栏、状态栏等所有视觉干扰,让你百分之百专注于代码逻辑。 ## 💯 必装插件推荐 ### 🤖 AI 增强类 - GitHub Copilot / Codeium:目前的标配 AI 助手,能够根据上下文自动补全整行甚至整段代码。

  • Tabnine:另一款强大的 AI 补全工具,尤其擅长处理私有化代码库。

🛠 生产力增强类

  • GitLens:将 Git 功能发挥到极致,直接在代码行末显示“谁在什么时候改了这行”。

  • Prettier:代码格式化神器,保证团队代码风格统一。

  • Live Server:一键开启本地开发服务器,修改 HTML/CSS 后浏览器实时刷新。

  • Error Lens:将报错信息直接显示在代码行中,不再需要鼠标悬停查看。