0%

Vue VSCode Snippets 自动生成Vue代码片段的VSCode扩展

作者:李旭光
引用请标明出处

前言

现代化的IDE已经把开发者变得越来越懒,但是我觉得这样挺好的,让工具完成手工反复重复的工作,提高工作效率的同时降低开发者的疲劳感,Vue VSCode Snippets就是这样一个VSC插件,它可以用简单的几个字母就敲出一整块代码片段,在学习和做VUE项目时可以极大地提高工作效率,下面就介绍一下插件的常见命令。

此插件可用比较简单的写法生成代码片段,非常适合开发工作,减少代码工作量。

Script

Snippet Purpose
vbase Single file component base
vbase Single file component base
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
vimport-c Import one component into another within the export statement
vimport-export Import one component into another and use it within the export statement
vfilter Vue filter
vmixin Create a Vue Mixin
vmixin-use Bring a mixin into a component to use
vc-direct Vue create a custom directive
vimport-lib Import a library
vimport-gsap Import GreenSock with Timeline and Eases
vanimhook-js Using the Transition component JS hooks in methods

Template

Snippet Purpose
vfor v-for directive
vmodel Semantic v-model directive
vmodel-num Semantic v-model number directive
von v-on click handler with arguments
vel-props Component element with props
vsrc Image src binding
vstyle Inline style binding
vstyle-obj Inline style binding with objects
vclass Class binding
vclass-obj Class binding with objects
vclass-obj-mult Multiple conditional class bindings
vanim Transition component with JS hooks

Vuex

Snippet Purpose
vstore Base for Vuex store.js
vgetters Vuex Getter
vmutation Vuex Mutation
vaction Vuex Action
vstore-import Import vuex store into main.js

Extra (plaintext)

Snippet Purpose
gitignore .gitignore file presets
vinc incrementer
vdec decrementer
如果觉得不错请支持作者
------ 版权声明 ------

本文标题:Vue VSCode Snippets 自动生成Vue代码片段的VSCode扩展

文章作者:

发布时间:2017年08月30日 - 16:23

最后更新:2023年09月20日 - 10:25

原始链接:https://blog.lifesli.com/2017/08/30/Vue-VSCode-Snippets/

许可协议: 署名-非商业性使用-禁止演绎 4.0 国际 转载请保留原文链接及作者。