https://github.com/stordahl/sveltekit-snippets

VSCode Snippets for SvelteKit & Vanilla Svelte
https://github.com/stordahl/sveltekit-snippets

snippets svelte vscode-extension

Last synced: about 2 hours ago
JSON representation

VSCode Snippets for SvelteKit & Vanilla Svelte

• Host: GitHub
• URL: https://github.com/stordahl/sveltekit-snippets
• Owner: stordahl
• Created: 2021-09-03T13:03:54.000Z (about 3 years ago)
• Default Branch: master
• Last Pushed: 2022-05-16T02:49:03.000Z (over 2 years ago)
• Last Synced: 2024-08-01T17:19:39.235Z (3 months ago)
• Topics: snippets, svelte, vscode-extension
• Homepage: https://marketplace.visualstudio.com/items?itemName=stordahl.sveltekit-snippets
• Size: 36.1 KB
• Stars: 40
• Watchers: 6
• Forks: 3
• Open Issues: 3
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md

Awesome Lists containing this project

• awesome-svelte-kit - SvelteKit Snippets

README

        
![sveltekit-snippets icon](https://github.com/stordahl/sveltekit-snippets/blob/master/images/icon.png)

    

# sveltekit-snippets

The extension provides snippets for common patterns in SvelteKit & Vanilla Svelte including...

- Components

- Logic Blocks

- Endpoints

- Load Functions

    

All snippets are prefixed with "kit" for brevity and scoped only for their appropriate placement in the Svelte component

## Snippets

|   Snippet   | Output |

|-------------|--------|

|   kitComp   | Scaffolds a Svelte component |

|  ktiCompTs  | Scaffolds a TypeScript Svelte component |

|  kitModule  | Scaffolds a SvelteKit module component for a page or layout |

| kitModuleTs | Scaffolds a SvelteKit Typescript module component for a page or layout |

|  kitLayout  | Scaffolds a SvelteKit Layout component |

| kitPrefetch | Create a sveltekit:prefetch anchor tag |

|   kitEach   | Create a Svelte `{#each}` block |

|    kitIf    | Create a Svelte `{#if}` block |

|   kitAwait  | Create a Svelte `{#await}` block |

|    kitKey   | Create a Svelte `{#key}` block |

|  kitTitle   | Create a title element in the document head |

|   kitLoad   | Create a SvelteKit Load function |

|  kitLoadTs  | Create a SvelteKit TypeScript Load function |

| kitEndpoint | Create a SvelteKit Endpoint |

| kitTsEndpoint | Create a SvelteKit TypeScript Endpoint |

## Troubleshooting

 - To enable intellisense in MD files for use with MDSvex, add the following JSON to your global settings.json

 ```json

  "[markdown]": {

    "editor.quickSuggestions": true,

    "editor.wordBasedSuggestions": false

  },

 ```

## Issues

Issues are welcome and encouraged! Please describe the issue as thoroughly as you can – Contribution guidelines are forthcoming.