Modern Angular Essentials Suite 🚀

Modern Angular Essentials Suite is the ultimate, curated extension pack designed by Code Dimension to deliver a premium, high-productivity environment for TypeScript, Angular, and full-stack front-end developers. Whether you're working on advanced reactive patterns, designing with Tailwind CSS, or looking for beautiful, clean developer tooling, this pack contains everything you need to build at speed.

What's Included? 📦

This pack bundles 13 essential extensions to elevate your VS Code workflow:

Extension Name	Extension ID	Rationale & Key Features
Angular Language Service	`Angular.ng-template`	Provides core editor capabilities, autocompletion, error checking, and navigation inside Angular templates (HTML and inline).
ESLint	`dbaeumer.vscode-eslint`	Integrates ESLint into VS Code to enforce clean code rules and catch JavaScript/TypeScript issues in real time.
Prettier - Code Formatter	`esbenp.prettier-vscode`	Standardizes format-on-save across HTML, TypeScript, SCSS/CSS, and JSON for seamless code styling.
Tailwind CSS IntelliSense	`bradlc.vscode-tailwindcss`	Offers intelligent autocomplete, CSS previews, and style linting for rapid utility-first CSS styling.
Pretty TypeScript Errors	`yoavbls.pretty-ts-errors`	Transforms convoluted and hard-to-read TypeScript compiler errors into human-friendly, readable visual blocks.
GitLens — Git supercharged	`eamodio.gitlens`	Unlocks powerful Git authorship insight, visual file history, and inline blame to seamlessly track your code evolution.
Spek	`kewang.spek-vscode`	Provides Kotlin Spek framework support, making testing and spec execution easy within your editor.
Copilot Theme	`BenjaminBenais.copilot-theme`	A beautiful, high-contrast, premium dark theme inspired by the modern look of GitHub Copilot.
Todo+	`fabiospamponato.vscode-todo-plus`	Manages todo lists with support for projects, tags, timers, and customized task-tracking formats.
Auto Close Tag	`formulahendry.auto-close-tag`	Automatically adds HTML/XML close tags, speeding up template design and nesting.
Auto Rename Tag	`formulahendry.auto-rename-tag`	Automatically renames paired HTML/XML tags in real time to avoid syntax errors.
EditorConfig for VS Code	`EditorConfig.EditorConfig`	Enforces consistent coding styles and formatting settings across teams and IDEs.
Figure	`imfeniljikadara.figure`	Integrates simple, elegant ASCII / drawing support directly in your editor workspace.

Extension Spotlights 💡

🔺 Modern Angular & UI Styling

Angular Language Service: Seamlessly integrates with Angular templates. Jump directly from templates to component TypeScript definitions using Ctrl+Click/Cmd+Click.
Tailwind CSS: Instant autocompletion of CSS classes. Hover over any class name to see the underlying CSS values.

🎨 Beautiful & Intuitive Workspace

Copilot Theme: Designed to minimize eye strain and offer beautiful visual separation of code syntax.
Pretty TS Errors: No more scrolling through 20 lines of nested object type errors. Read exactly what is wrong immediately!

⚡ Professional Quality Assurance

ESLint & Prettier: The industry standard for automated format-on-save and style linting.
GitLens: Understand file history instantly without breaking your flow.

How to Install 🚀

Option 1: VS Code UI

Open VS Code.
Go to the Extensions view (Ctrl+Shift+X or Cmd+Shift+X).
Search for codedimension.cd-angular-essentials-suite.
Click Install.

Option 2: Command Line

code --install-extension codedimension.cd-angular-essentials-suite

Option 3: Install from Local `.vsix`

If you are using the pre-compiled local .vsix file:

Open the Extensions side-bar.
Click the ... menu (top right of the Extensions panel).
Select Install from VSIX... and choose the cd-angular-essentials-suite-1.0.1.vsix file.

Publishing and Packaging (For Maintainers) 🛠️

If you need to rebuild or publish this extension pack to marketplaces:

Requirements

Ensure you have Node.js and npm installed.

Build and Package (Local VSIX)

To package the extension into a shareable .vsix bundle locally:

# Package the extension without installing extra dependencies
npx @vscode/vsce package --no-dependencies

Publish to VS Code Marketplace

Make sure you have a publisher account for codedimension on the Marketplace Console.
Log in using your Personal Access Token (PAT):

   npx @vscode/vsce login codedimension

Publish:

   npx @vscode/vsce publish

Publish to Open VSX Registry (vsox)

   npx ovsx login codedimension

Publish:

   npx ovsx publish cd-angular-essentials-suite-1.0.1.vsix

License 📄

This extension pack is open-source and licensed under the MIT License.

Made with ❤️ by Code Dimension

Modern Angular Essentials Suite

Code Dimension