Skip to content

What do you think about Visual Studio Marketplace? We are looking for feedback from developers like you! Take the survey

| Marketplace
Sign in
Visual Studio Code>Snippets>Astro SnippetsNew to Visual Studio Code? Get it now.

Astro Snippets

Shelton Louis

|
80 installs
| (0) | Free
It is set of snippets for Astro JS
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Astro Snippets

This extension is a set of Snippets for Astro. They are created so that scaffolding with Astro can be easy. You can try to remember most of these but. Before reading the full snippets down below. The snippets are made so that you write your HTML before writing your scripts and styles.

Basic Snippets


Expression Snippets

I created list for you to understand the fundamental things about these snippets.

  • base stands for scaffold

  • cbase stands for scaffolding client instead of server script

  • frag stands for fragment

  • gsp stands for getStaticPaths

  • tern stands for ternary

  • gc stands for getCollections

  • cmp stands for component

  • pg stands for page

  • prpg stands for pre-rendered page

Features

Here is a table with a list of all the snippets you can use. Hope this is helpful.

Astro Snippets

Snippet Purpose
iige Immediately Invoked Generator Expression
iife Immediately Invoked Function Expression
a-base Astro Single File Component
a-cbase Astro Single File Component w Client Script
a-base-hmf This is a header footer main snippet
a-frag-html This is a fragment with set html
a-frag-slot This is a fragment with a slot name in it
a-base-prpg This is a pre-rendered page snippet
a-base-prpg-gsp This is a pre-rendered page with getStaticPaths Setup
a-base-gsp This is a page snippet with getStaticPaths
a-base-cmp This is a basic Astro components
a-base-cmp-csc This is an Astro component with a client script
a-base-lpg This a page with layout scaffolding
a-base-hf-slots Layout Page with Header and Footer slot
a-base-gc-gsp Scaffold for Get Collections With getStaticPaths
a-cbase-dvst Astro base with Define Vars Style
a-cbase-dvsc Astro base with Define Vars Script
a-tern A ternary expression scaffold
a-map This is a simple map expression for Astro
a-map-ft This is a map expression for Astro using a anonymous function
a-slot-tern Astro Ternary with Slots has and Render
a-slot-ft A fragment slot with a function to return HTML

Javascript Snippets

Snippet Purpose
a-base-cc This is for scaffolding a Collection Config
a-sc This is the single collection setup

Release Notes

I have decided that the release notes should be kept in the changelog file. I don't understand why both exist. Look at the changelog to see changes to this library.


  • Contact us
  • Jobs
  • Privacy
  • Terms of use
  • Trademarks
© 2023 Microsoft