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+.