Angular Extension Pack：Visual Studio Code Angular开发的终极工具集

Angular Extension Pack是一款专门为Visual Studio Code设计的扩展工具包，旨在提升您的Angular开发效率。该包包含多种热门且实用的Angular扩展，不仅适用于我的免费葡萄牙语Angular培训，也适合所有希望提升Angular开发体验的开发者。

包含的扩展：

代码片段与导航

• Angular Angular Material NgRX RxJS Code Snippets：提供Angular、TypeScript、Angular Material、Flex layout、Covalent和Material图标的代码片段，帮助您快速编写代码。
• Angular File Changer：支持在Mac Touch Bar或键盘上快速导航至Angular组件相关文件或NgRx文件。
• angular2-switcher：在Angular项目中轻松切换至TypeScript、HTML模板和样式文件（.scss/.sass/.less/.css）。

测试与调试

• SimonTest：自动分析您的Angular代码并生成单元测试，支持覆盖Angular CLI自动生成的spec文件。
• Karma Problem Matcher：捕获Karma测试在Visual Studio Code中运行的错误，使测试失败显示在“问题”面板中，并能高亮显示错误并快速跳转。

模板生产力

• Angular Language Service：为Angular模板提供丰富的编辑体验，非常适合处理Angular HTML模板。
• Auto Rename Tag：自动重命名成对的HTML/XML标签。
• Auto Close Tag：自动添加HTML/XML关闭标签，类似于Visual Studio IDE或Sublime Text。
• Arrr：用于从HTML模板中重构组件的工具。

生产力提升

• Auto Import：自动查找、解析并提供所有可用导入的代码操作和代码完成。

• Paste JSON as Code：将剪贴板中的JSON转换为TypeScript接口。

• Prettier - JavaScript formatter：格式化您的JavaScript/TypeScript/CSS代码，特别推荐以下配置：

  • "prettier.singleQuote": true：有助于使用自动导入扩展或VSCode的自动导入功能。
  • "prettier.tabWidth": 2：Angular Lint默认使用2个空格作为缩进，您可以继续使用制表符。
  • "prettier.useTabs": false：与上述配置一致。

• Path Intellisense：在需要手动导入文件时提供帮助。

• Move TS：帮助重构和重新组织项目中的文件和组件，自动修复导入。

• Angular Schematics：允许从文件资源管理器或命令面板启动Angular schematics（CLI命令）。

• Angular-cli：简化在Visual Studio Code中使用Angular CLI。

代码分析

• ESLint：代码质量检查工具。
• TypeScript Hero：排序和组织您的导入，删除未使用的导入。

工作台

• EditorConfig for VS Code：为Visual Studio Code提供EditorConfig支持。

其他推荐但未包含的扩展：

• angular2-inline：支持Angular组件中的内联HTML和CSS。
• NgBootstrap Snippets：如果您需要在Angular项目中使用Bootstrap 4，这些片段会很有帮助。
• vscode-icons：我的最爱，提供丰富的VSCode项目图标。
• Git History (git log)：查看带图形和详细信息的git历史记录。
• snippet-creator：帮助您创建代码片段，并将其保存到VSCode的用户片段中。

祝您编码愉快！