Clera IntelliSense
VS Code extension for the Clera runtime. Adds completions, diagnostics, and scaffolds to HTML files.
Features
Attribute completions
Clera-specific attributes are suggested inside any Clera or HTML tag — ranked above standard HTML attributes.
| Tag |
Attributes |
<app> |
initial, dev, expose, maxCachedPages, accessibility, persistPage |
<page> |
name, keep-alive, target, oncreate, onshow, onhide, ondestroy |
<tabbar> |
position |
<tab> |
page, label, icon |
<use> |
template, name |
| Any element |
action, page, route, template |
Page names in page=, initial=, and oncreate= values are inferred live from the open file.
Scaffold snippets
Type a prefix and press Tab to expand a full Clera scaffold.
| Prefix |
Expands to |
page:full |
<page> with all lifecycle attributes |
tab-layout |
<tabbar> with 3 tabs and CSS |
form-action |
<form action="..."> with fields and submit |
use: |
<use template="..." /> |
use:inline |
<use> void form |
link:css |
Stylesheet <link> |
link:manifest |
Web app manifest <link> |
script:src |
External <script> |
meta:viewport |
Responsive viewport <meta> |
meta:og |
Open Graph <meta> tags |
Diagnostics
Errors and warnings appear inline as you type.
- Missing
<app> root when Clera tags are present
<page> elements with no name attribute
<tab page="..."> referring to an unregistered page
- Unknown tags not registered via
app.registerComponent()
Diagnostics can be toggled per setting (see below).
Settings
| Setting |
Default |
Description |
clera.enableDiagnostics |
true |
Enable all Clera lint diagnostics |
clera.enableUnknownTagErrors |
true |
Flag unknown tags not registered as components |
clera.globalName |
"CLERA" |
Runtime global name used in diagnostic messages |
Supported file types
.html — completions and diagnostics active in any HTML file
License
MIT
| |