YYFE Pack：YeeYun前端团队推荐的VS Code插件合集

YYFE Pack 是由 YeeYun 前端团队精心打造的 Visual Studio Code 插件集合，旨在提升前端开发者的工作效率和代码质量。该合集包含21款精选插件，涵盖代码格式化、语法高亮、错误检查、智能提示等多种功能，满足开发者在日常开发中的各种需求。

包含插件：

1. ESLint：集成 ESLint JavaScript 到 VS Code 中，确保代码质量。
2. GitLens：增强 VS Code 中的 Git 功能，提供更好的版本控制体验。
3. HTML CSS Support：为 Visual Studio Code 提供 HTML id 和 class 属性补全功能。
4. Prettier：使用 Prettier 进行代码格式化，保持代码一致性。
5. Document This：自动生成详细的 JSDoc 注释，适用于 TypeScript 和 JavaScript 文件。
6. colorize：帮助在文件中可视化 CSS 颜色。
7. image preview：在边缘和悬停时显示图像预览。
8. Code Spell Checker：为源代码提供拼写检查。
9. Stylelint：官方 Stylelint 扩展，用于 Visual Studio Code。
10. Highlight Matching Tag：高亮匹配的关闭和打开标签。
11. Visual Studio IntelliCode：AI 辅助开发，提供智能代码建议。
12. EditorConfig for VS Code：为 Visual Studio Code 提供 EditorConfig 支持。
13. Vue Language Features (Volar)：为 Vue 3 提供语言支持。
14. language-postcss：PostCSS 语言支持。
15. PostCSS Intellisense and Highlighting：为 PostCSS 提供语法高亮和智能提示。
16. CSS Variable Autocomplete：CSS 变量全局扫描，支持自动提示、颜色预览、跳转定义。
17. Error Lens：改进错误、警告和其他语言诊断的高亮显示。
18. markdownlint：为 Visual Studio Code 提供 Markdown 语法检查和风格检查。
19. TODO Highlight：高亮 TODO、FIXME 及其他关键词和注释。
20. Iconify IntelliSense：为 VS Code 提供智能 Iconify 预览和搜索。

Vscode 配置：

要使用 YYFE Pack，你需要在 VS Code 中添加以下配置：

{
  "extensions.autoUpdate": true,
  // 让HTML CSS Support插件支持vue
  "css.enabledLanguages": ["html", "vue"]
}

其他非用户级设置将在项目初始化时自动添加，无需手动配置。

推荐插件：

除了 YYFE Pack 中的插件，我们还推荐以下插件来进一步提升你的开发体验：

1. bookmarks：标记行并跳转到它们。
2. git-commit-plugin：自动生成 git commit。
3. ES7 React/Redux/React-Native snippets：在 VS Code 中提供 ES7 与 Babel 插件功能的 JavaScript 和 React/Redux 代码片段。
4. Live Server：启动一个带有实时重载功能的本地开发服务器，适用于静态和动态页面。
5. Markdown Emoji：为 VS Code 的内置 Markdown 预览和笔记本中的 Markdown 单元格添加 :emoji: 语法支持。
6. Markdown Preview Enhanced：Markdown Preview Enhanced 移植到 vscode。
7. Quit Control for VSCode：防止无意中关闭/退出 VSCode 的键盘快捷键误操作。
8. filesize：在状态栏显示当前文件大小。
9. File Nesting Updater：通过 VS Code 的文件嵌套功能使你的文件树更整洁。
10. change-case：快速更改大小写（camelCase、CONSTANT_CASE、snake_case 等）。
11. Git Graph：查看你的存储库的 Git 图表，并从图表中执行 Git 操作。
12. Version Lens：使用代码透镜显示每个包的最新版本。

已过时插件：

1. vetur：适用于 Vue2 的插件。
2. Bracket Pair Colorizer 2：已被官方内置。
3. npm：npm 脚本执行插件，现在已内置。

通过使用 YYFE Pack 和推荐的插件，你将能够大幅提升你的前端开发效率和代码质量。