Language Svelte
HTML (Svelte)
Provides syntax highlighting for Svelte Components, directives and other Svelte specific syntax in Atom.
If you are looking for IDE support use ide-svelte instead.
Syntax naming conventions
Syntax naming is done following conventions from Sublime and TextMate.
Features
- Html snippet / autocompletion support from atom/language-html
- Svelte snippets for: {#if}, {#each}, {#await} and
<svelte:tag>.
Roadmap to v1.0.0
-
All Svelte syntax captured:
-
Template blocks; if, each, await.
-
{expression}- Svelte expressions -
<svelte:tag> -
<script> -
<script context="module"> -
<style> -
<style lang="postcss|sass|less"> -
<Component/>(tag.component) -
Element directives:
- on - event directive
- bind - data flow directives
- class - css classes directive
- use - action directive
- transition|animate|in|out - motion directives
-
Component directives; on, bind.
-
Svelte component lifecycle
-
Svelte slot element; named slot, slot property values
-
Svelte modules; stores, motion, transition, animation
-
-
Snippets
-
{#if} -
{#each} -
{#await} -
<svelte:x> -
Accessibility related (html snippets)
-
-
Tree sitter Svelte... This seems to be a bit more advanced stuff and might be done in v1.1+.