Overview Version History Q & A Rating & Review
This is an unofficial snippets extension for AWS Amplify users. Speed up your development by scaffolding out commonly used code snippets for Amplify CSS , UI Components , API /DataStore calls, and GraphQL Transform directives.
:warning: this is unofficial and has not formally maintained by the Amplify team! It is a personal project of some employees.
On the plus side, it's very simple. pls feel free to fork and customize your own!
There is an older extension where you can find more snippets here .
See Gif Demo
Install
You can add this by searching Amplify Snippets in your VS Code Extensions.
Direct link here: https://marketplace.visualstudio.com/items?itemName=sw-yx.amplify-vscode-snippets
Snippets Included
TypeScript/JavaScript
Prefix
Method
import amplify→import Amplify from 'aws-amplify';import awsconfig from './aws-exports';Amplify.configure(awsconfig);
withAuthenticator→import { withAuthenticator, AmplifySignOut } from \"@aws-amplify/ui-react\"
import API from Amplify→import { API } from 'aws-amplify'
DataStore import→import { DataStore } from '@aws-amplify/datastore' etc
DataStore Read→relevant sample code - specific to React for now
DataStore Create→relevant sample code
DataStore Update→relevant sample code
DataStore Delete→relevant sample code
CSS
Prefix
Method
Amplify :root→--amplify-primary-color/tint/shade
GraphQL
Prefix
Method
@auth public read→@auth(rules: [{ allow: owner, queries: null }])
@auth everything private→@auth(rules: [{ allow: owner }])
basic @model with no auth→type Todo @model { /* etc */ }
Known Issues
this is not an official extension! it is just a helper for swyx
Publishing
