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.

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

• pr-pg stands for pre-rendered page

• clt stands for col lec tion

• anfn stands for anonymous function

Features

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

Astro Snippets

Snippet	Purpose
a:iige	Immediately Invoked Generator Expression
a: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:frag--slot--anfn	A fragment slot with a function to return HTML
a:base-pr-pg	This is a pre-rendered page snippet
a:base-pr-pg--gsp	This is a pre-rendered page with getStaticPaths Setup
a:base-gsp	This is a page snippet with getStaticPaths
a:base-gsp--gc	Scaffold for Get Collections With getStaticPaths
a:base-cmp	This is a basic Astro components
a:base-cmp--cs	This is an Astro component with a client script
a:base-lpg	This a page with layout scaffolding
a:base-lpg--hmf	Layout Page with Header and Footer slot
a:tern	A ternary expression scaffold
a:map	This is a simple map expression for Astro
a:map--anfn	This is a map expression for Astro using a anonymous function

Javascript Snippets

Snippet	Purpose
a:base-cc	This is for scaffolding a Collection Config
a:clt	This is the single collection setup
a:clt--data	This is the single data collection setup with relations

Recommendations

Please use these snippets along with these extensions:

• TS?X Snippets
• Auto Rename Tag
• Astro (duh)