vscode自定义vue模板的实现


Posted in Vue.js onJanuary 27, 2021

用vscode编辑器创建vue模板,再也不用每次新建vue文件的时候都去一遍遍的重复敲某些代码片段。输入 vue 再按回车键,即可生成自定义的vue文件内容,相当的好使,开发效率蹭蹭的上去了。

打开vscode,选择文件 > 首选项 > 用户片段。随后在出现的输入框内输入vue,按回车键。打开了一个叫vue.json的文件。如图:

vscode自定义vue模板的实现

图片内容已经是添加了相应的模板内容了,解释下,prefix字段表示的是自定义指令,就是我们在vue文件里面输入的vue标签,按回车即可生成自定义的文件内容;body里面就是我们自定义的内容了。\t是制表符,我这里主要是做格式化代码用

创建完vue模板后,就可以通过vue来创建文件啦!如下图:

vscode自定义vue模板的实现

代码内容:

"Print to console": {
 "prefix": "vue",
 "body": [
 "<!-- $0 -->",
 "<template>",
  "\t<div>",
  "",
  "\t</div>",
 "</template>",
 "",
 "<script>",
 "export default {",
    "\tname: '',",
 "\tcomponents: {},",
 "\tdata () {",
 "\treturn {",
 "\t}",
 "\t},",
 "\tmounted () {},",
 "\tmethods: {}",
 "}",
 "</script>",
 "<style scoped='scss' scoped>",
 "</style>"
 ],
 "description": "vue output to vue-template"
  }

此时有没发现vue模板是把开发的利器,好使好使!!!!!

到此这篇关于vscode自定义vue模板的实现的文章就介绍到这了,更多相关vscode自定义vue模板内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Vue.js 相关文章推荐
Vue实现购物小球抛物线的方法实例
Nov 22 Vue.js
Vue3 实现双盒子定位Overlay的示例
Dec 22 Vue.js
vue实现登录、注册、退出、跳转等功能
Dec 23 Vue.js
详解vue之自行实现派发与广播(dispatch与broadcast)
Jan 19 Vue.js
用vite搭建vue3应用的实现方法
Feb 22 Vue.js
Vue全家桶入门基础教程
May 14 Vue.js
Vue如何实现组件间通信
May 15 Vue.js
详解Vue slot插槽
Nov 20 Vue.js
vue如何使用模拟的json数据查看效果
Mar 31 Vue.js
Vue组件更新数据v-model不生效的解决
Apr 02 Vue.js
Vue操作Storage本地化存储
Apr 29 Vue.js
Vue Element plus使用方法梳理
Dec 24 Vue.js
vue+echarts实现中国地图流动效果(步骤详解)
Jan 27 #Vue.js
vue3 watch和watchEffect的使用以及有哪些区别
Jan 26 #Vue.js
vue实现轮播图帧率播放
Jan 26 #Vue.js
vue 组件基础知识总结
Jan 26 #Vue.js
深入了解Vue动态组件和异步组件
Jan 26 #Vue.js
如何在 Vue 表单中处理图片
Jan 26 #Vue.js
Vue实现摇一摇功能(兼容ios13.3以上)
Jan 26 #Vue.js
You might like
php和mysql中uft-8中文编码乱码的几种解决办法
2012/04/19 PHP
php定时计划任务的实现方法详解
2013/06/06 PHP
解析使用substr截取UTF-8中文字符串出现乱码的问题
2013/06/20 PHP
php注册审核重点解析(数据访问)
2017/05/23 PHP
动态加载js文件 document.createElement
2006/10/14 Javascript
javascript ie6兼容position:fixed实现思路
2013/04/01 Javascript
jquery 获取表单元素里面的值示例代码
2013/07/28 Javascript
JS简单的图片放大缩小的两种方法
2013/11/11 Javascript
js创建元素(节点)示例
2014/01/02 Javascript
js使用for循环及if语句判断多个一样的name
2014/09/09 Javascript
使表格的标题列可左右拉伸jquery插件封装
2014/11/24 Javascript
基于Jquery实现表单验证
2020/07/20 Javascript
jQuery入门基础知识学习指南
2015/08/14 Javascript
详解原生JavaScript实现jQuery中AJAX处理的方法
2016/05/10 Javascript
使用smartupload组件实现jsp+jdbc上传下载文件实例解析
2017/01/05 Javascript
vue实现验证码按钮倒计时功能
2018/04/10 Javascript
微信小程序云开发之新手环境配置
2019/05/16 Javascript
浅谈Vue3.0之前你必须知道的TypeScript实战技巧
2019/09/11 Javascript
浅谈Vue为什么不能检测数组变动
2019/10/14 Javascript
vue实现吸顶、锚点和滚动高亮按钮效果
2019/10/21 Javascript
vue中el-input绑定键盘按键(按键修饰符)
2020/07/22 Javascript
python中lambda函数 list comprehension 和 zip函数使用指南
2014/09/28 Python
Django日志模块logging的配置详解
2017/02/14 Python
python多线程案例之多任务copy文件完整实例
2019/10/29 Python
详解pandas获取Dataframe元素值的几种方法
2020/06/14 Python
解决pytorch 保存模型遇到的问题
2021/03/03 Python
CSS3+JavaScript实现炫酷呼吸效果的示例代码
2020/06/15 HTML / CSS
学院领导推荐信
2013/10/30 职场文书
销售副总经理岗位职责
2013/12/11 职场文书
开展党的群众路线教育实践活动方案
2014/02/05 职场文书
《风筝》教学反思
2014/04/10 职场文书
股东合作协议书
2014/04/14 职场文书
解除租房协议书
2014/12/03 职场文书
农民工工资承诺书大全
2015/05/04 职场文书
oracle覆盖导入dmp文件的2种方法
2021/05/21 Oracle
解决tk mapper 通用mapper的bug问题
2021/06/16 Java/Android