Skip to main content
The Aero VS Code extension adds first-class editor support for .html template files. Install it to get feedback in your editor as you write — without running a build.

​
The problem

Template files need Aero-aware component and directive feedback, but changing their language mode can stop ordinary HTML tooling, formatters, and installed HTML extensions from recognizing them.

​
How Aero helps

Aero keeps project templates in VS Code’s native html language and adds only its framework-aware features. HTML/CSS tooling and other extensions keep ownership of their normal behavior, while Aero adds template diagnostics and TypeScript/JavaScript support for live script blocks. The extension turns off built-in HTML script validation (html.validate.scripts) so TypeScript in <script is:build> / <script is:state> is not flagged as invalid JavaScript; Aero’s language server provides the real checks.

​
Install

Install from the VS Code Marketplace: Aero Extension Or search for Aero in the VS Code Extensions panel.

​
What you get

  • Syntax highlighting — Aero expressions, <script is:build>, and component syntax are highlighted correctly inside .html files.
  • Completions — Component names and attributes are suggested as you type.
  • Hover info — Hover over components and expressions to see type information.
  • Go to definition — Jump from a component reference in a template to its source .html file.
  • Diagnostics — Template errors and configured TypeScript/JavaScript issues are underlined inline. aero check --types validates live build, state, bundled, inline, and blocking scripts plus expressions on the command line.
  • Formatting — Recommends the Prettier extension for Aero HTML templates (see Formatting). Also contributes Prettier config schema so aero* options autocomplete and show hover docs in .prettierrc / .prettierrc.json.
If you see false positives or missing diagnostics, run aero doctor in your project root to confirm the extension can find a supported version of @aero-js/core.

​
Formatting

Install Prettier and add @aero-js/prettier-plugin-aero to your project. See Formatting for .prettierrc setup and Aero-specific options. In .prettierrc / .prettierrc.json, typing aero under top-level options or overrides[].options should suggest aeroAttributePrefix, aeroBracketSpacing, and aeroSelfClosingComponents, with hover text describing each value.

​
Comments and snippets

HTML comments are inactive template source: Aero does not create template diagnostics or TypeScript fragments from commented components, directives, scripts, or expressions. Snippet modules under content/snippets/ are the exception: their raw <!-- @snippet:name --> markers are still read by the snippet extractor.