1.0.1 • Published 3 years ago
@phoenix-plugin-registry/vue-snippets v1.0.1
Vue Snippets
Description
A collection of VUE snippets for Brackets editor.
Installation
Git Clone
- Under main menu select Help > Show Extensions Folder
- Git clone this repository inside the folder user.
Extension Manager
- Under main menu select File > Extension Manager...
- Search for "Vue snippets"
- Click "Install"
How to use
- Enable Vue Snippets Under main menu select Edit > Enable Vue Snippets or open the Preferences File and add "vue-snippets.enabled": true.
- Enter a snippet and hit the
Space
key.
Snippets
Vue
Snippet | Purpose |
---|---|
vbase | Single file component base |
Template
Snippet | Purpose |
---|---|
vfor | v-for directive |
vmodel | Semantic v-model directive |
vmodelNum | Semantic v-model number directive |
von | v-on click handler with arguments |
velProps | Component element with props |
vsrc | Image src binding |
vstyle | Inline style binding |
vstyleObj | Inline style binding with objects |
vclass | Class binding |
vclassObj | Class binding with objects |
vclassObjMult | Multiple conditional class bindings |
vanim | Transition component with JS hooks |
vnuxtl | Nuxt Routing Link |
Script
Snippet | Purpose |
---|---|
vdata | Component data as a function |
vmethod | Vue method |
vcomputed | Vue computed property |
vwatcher | Vue watcher with new and old value args |
vprops | Props with type and default |
vimport | Import one component into another |
vcomponents | Import one component into another within the export statement |
vimportExport | Import one component into another and use it within the export statement |
vfilter | Vue filter |
vmixin | Create a Vue Mixin |
vmixinUse | Bring a mixin into a component to use |
vcDirect | Vue create a custom directive |
vimportLib | Import a library |
vimportGsap | Import GreenSock with Timeline and Eases |
vanimhookJS | Using the Transition component JS hooks in methods |
vcommit | Commit to Vuex store in methods for mutation |
vdispatch | Dispatch to Vuex store in methods for action |
vtest | A simple unit testing component |
vinc | incrementer |
vdec | decrementer |
Vuex
Snippet | Purpose |
---|---|
vstore | Base for Vuex store.js |
vgetter | Vuex Getter |
vmutation | Vuex Mutation |
vaction | Vuex Action |
vstoreImport | Import vuex store into main.js |
Nuxt Config
Snippet | Purpose |
---|---|
nfont | link to include fonts in a nuxt project, in nuxt-config |
ncss | link to css assets such as normalize |
Credits
- vue-vscode-snippets - Sarah Drasner - https://github.com/sdras/vue-vscode-snippets
- brackets-jade-snippets - George Raptis - https://github.com/georapbox/brackets-jade-snippets
Thank you all!!!
1.0.1
3 years ago