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 表单输入框不支持focus及blur事件的解决方案
Nov 17 Vue.js
详解vue-cli项目在IE浏览器打开报错解决方法
Dec 10 Vue.js
vue使用exif获取图片经纬度的示例代码
Dec 11 Vue.js
利用Vue实现简易播放器的完整代码
Dec 30 Vue.js
Vue中inheritAttrs的使用实例详解
Dec 31 Vue.js
如何在vue中使用HTML 5 拖放API
Jan 14 Vue.js
Vue中的nextTick作用和几个简单的使用场景
Jan 25 Vue.js
vue实现可移动的悬浮按钮
Mar 04 Vue.js
详解Vue的sync修饰符
May 15 Vue.js
vue基于Teleport实现Modal组件
May 31 Vue.js
vue里使用create, mounted调用方法
Apr 26 Vue.js
vue router 动态路由清除方式
May 25 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数据库操作类(实例讲解)
2017/08/06 PHP
地址栏上的一段语句,改变页面的风格。(教程)
2008/04/02 Javascript
js 有框架页面跳转(target)三种情况下的应用
2013/04/09 Javascript
Jquery通过Ajax访问XML数据的小例子
2013/11/18 Javascript
Jquery创建一个层当鼠标移动到层上面不消失效果
2013/12/12 Javascript
JavaScript中奇葩的假值示例应用
2014/03/11 Javascript
js中string转int把String类型转化成int类型
2014/08/13 Javascript
一段非常简单的js判断浏览器的内核
2014/08/17 Javascript
jquery实现的用户注册表单提示操作效果代码分享
2015/08/28 Javascript
异步加载JS、CSS代码(推荐)
2016/06/15 Javascript
JavaScript判断数组是否存在key的简单实例
2016/08/03 Javascript
bootstrapValidator.min.js表单验证插件
2017/02/09 Javascript
一个简易的js图片轮播效果
2017/07/22 Javascript
基于Require.js使用方法(总结)
2017/10/26 Javascript
react-native android状态栏的实现
2018/06/15 Javascript
vue.js input框之间赋值方法
2018/08/24 Javascript
微信小程序获取音频时长与实时获取播放进度问题
2018/08/28 Javascript
Vue源码中要const _toStr = Object.prototype.toString的原因分析
2018/12/09 Javascript
微信公众号服务器验证Token步骤图解
2019/12/30 Javascript
小程序双头slider选择器的实现示例
2020/03/31 Javascript
[53:10]Secret vs Pain 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/20 DOTA
Python数据分析之获取双色球历史信息的方法示例
2018/02/03 Python
django数据库migrate失败的解决方法解析
2018/02/08 Python
python openCV获取人脸部分并存储功能
2019/08/28 Python
使用python制作游戏下载进度条的代码(程序说明见注释)
2019/10/24 Python
德购商城:德国进口直邮商城
2017/06/13 全球购物
印尼太阳百货公司网站:Matahari
2018/02/04 全球购物
入党积极分子介绍信
2014/01/17 职场文书
网上蛋糕店创业计划书
2014/01/24 职场文书
婚纱摄影师求职信范文
2014/04/17 职场文书
《三亚落日》教学反思
2014/04/26 职场文书
农业开发项目建议书
2014/05/16 职场文书
设备管理实施方案
2014/05/31 职场文书
2014年计生标语
2014/06/23 职场文书
2014年个人委托书范本
2014/10/13 职场文书
JDK8中String的intern()方法实例详细解读
2022/09/23 Java/Android