vue:VSCode添加自定义vue文件初始化模板
2023-09-11 14:22:32 时间
需求
在VSCode中,每次新建一个空白的vue文件后,我总需要重复书写templete、script、style三部分标签,因此想要将自定义的初始化内容保存为模板
参考
上网搜了搜,发现VSCode添加自定义模板这篇博文中已经进行了详细的记录,参照其中的配置方式操作即可
初始化内容
这篇博客主要是为了记录一下我个人的vue初始化模板内容:
{
"Print to console": {
"prefix": "vue",
"body": [
"<template>",
"\t<div>",
"\t\t${1:init}",
"\t</div>",
"</template>",
"",
"<script>",
"export default {",
"\tdata () {",
"\t\treturn {}",
"\t},",
"\tmethods: { }",
"}",
"</script>",
"",
"<style lang=\"scss\">",
"</style>"
],
"description": "init vue file"
}
}
扩展
在阅读vue.json文件原有的注释内容时,我对其中记录的形如“$1,$2,$0”以及“${1:label},${2:another}”的用法产生了兴趣,于是搜到了这篇博文:VSCode中snippets(代码模板)的使用,其中有对自定义模板的tabstops与placeholders用法的详细说明,感兴趣的小伙伴可以自行了解~
参考网址
相关文章
- Vue- 绑定的图片不显示
- VUE - vue.runtime.esm.js?6e6d:619 [Vue warn]: Do not use built-in or reserved HTML elements as component i
- Gitee 码云 pages 搭建vue项目记录
- VSCODE平台上使用VU3 遇到报错 提示找不到VUE模块
- vscode vue 片段
- [Vue @Component] Define Props on a Vue Class with vue-property-decorator
- [Vue @Component] Simplify Vue Components with vue-class-component
- [Vue] Conditionally Render DOM Elements in Vue.js (v-if v-else v-show)
- Vue.js3: 页面打开前实现图片全部预加载(vue@3.2.33)
- vue项目eslint环境配置与vscode配置eslint
- vue父子组件传值:子修改父
- Vue入门教程:node安装vue命令行工具及启动项目
- vue-router和location.href的用法区别是什么?
- 如何用Vue + Mint UI实现上拉加载更多?
- 一个典型的Vue应用的App.vue
- standalone vue initialization process - Vue应用的初始化过程
- vue-router路由的安装、配置、具体用法和Vue-router学习笔记
- 如何解决Vue项目中使用echarts,宽度变化导致图不能resize问题
- vue3 报错解决:找不到模块‘xxx.vue’或其相应的类型声明。(Vue 3 can not find module)
- Mac中如何搭建Vue项目并利用VSCode开发
- 033:vue+openlayers上传KML文件并解析(示例代码)
- 使用VSCode创建第一个VUE项目
- Vue(一)vue 概述与用法、MVVM、绑定语法、vue 指令
- Vue打包并发布项目
- Vscode中vue代码颜色插件
- Vue: vue-router路由
- 测试开发之Vue学习笔记-H5实例百度音乐