分享一个自己的vscode中vue自定义模板

简介: 分享一个自己的vscode中vue自定义模板

因为在公司都是用scss 规范化的代码,这里写一个自己的vue模板方便以后自己或者他人使用

一、ctrl + shift + p 在vscode打开弹窗输入snippets然后点击再输入vue点击会进入vue.json文件

二、编辑如下代码

"Print to console": {
    "prefix": "vue",
    "body": [
      "<template>",
      "  <div class=\"\">$0</div>",
      "</template>",
      "",
      "<script>",
      "export default {",
      "  components:{},",
      "  data(){",
      "    return {",
      "    }",
      "  },",
      "  created(){},",
      "  mounted(){},",
      "  watch:{},",
      "  computed:{},",
      "  methods:{},",
      "}",
      "</script>",
      "<style lang=\"scss\" scoped>",
      "</style>"
    ],
    "description": "A vue file template"
  }

三、新建一个.vue文件,直接输入vue回车

相关文章
|
3月前
|
JavaScript
vue学习(3)模板语法
vue学习(3)模板语法
63 11
|
1月前
|
存储 JavaScript 前端开发
vue3的脚手架模板你真的了解吗?里面有很多值得我们学习的地方!
【10月更文挑战第21天】 vue3的脚手架模板你真的了解吗?里面有很多值得我们学习的地方!
vue3的脚手架模板你真的了解吗?里面有很多值得我们学习的地方!
|
6月前
|
JSON JavaScript 数据格式
vue在vscode代码格式化
vue在vscode代码格式化
253 2
|
3月前
|
JavaScript 前端开发 开发者
Vue3:快速生成模板代码
Vue3:快速生成模板代码
|
4月前
|
JavaScript 开发工具 容器
初始Vue、Vue模板语法、数据绑定(2022/7/3)
这篇文章是关于Vue.js基础的介绍,包括Vue的简介、安装使用、开发工具、基础知识、模板语法和数据绑定。文中通过代码实例和页面效果展示了如何创建Vue实例、使用插值和指令语法、以及单向和双向数据绑定的方法。
初始Vue、Vue模板语法、数据绑定(2022/7/3)
|
3月前
|
JavaScript 前端开发 搜索推荐
推荐5款免费、开箱即用的Vue后台管理系统模板
推荐5款免费、开箱即用的Vue后台管理系统模板
130 1
|
4月前
|
JavaScript 前端开发 开发者
【颠覆你的前端世界!】VSCode + ESLint + Prettier:一键拯救Vue代码于水深火热之中,打造极致编程体验之旅!
【8月更文挑战第9天】随着前端技术的发展,保持代码规范一致至关重要。本文介绍如何在VSCode中利用ESLint和Prettier检查并格式化Vue.js代码。ESLint检测代码错误,Prettier保证风格统一。首先需安装VSCode插件及Node.js包,然后配置ESLint和Prettier选项。在VSCode设置中启用保存时自动修复与格式化功能。配置完成后,VSCode将自动应用规则,提升编码效率和代码质量。
549 1
|
5月前
|
缓存 JavaScript 前端开发
前端框架与库 - Vue.js基础:模板语法、数据绑定
【7月更文挑战第14天】Vue.js 是渐进式框架,以简洁API和高效数据绑定知名。本文聚焦模板语法与数据绑定,解释常见问题和易错点,助力初学者避坑。模板语法中,{{ expression }} 用于渲染值,v-bind/: 用于动态绑定属性。数据绑定涉及文本、属性和事件,注意v-model适用于表单元素,计算属性有缓存。理解正确用法,借助文档和IDE,可提升开发质量和效率。善用Vue.js,打造响应式UI。
151 4
|
5月前
|
JavaScript IDE 开发工具
vue3【2024版】开发环境搭建(含官网和nvm下载切换最新版node,修改node下载源,创建项目,启动项目,安装vscode插件Vue - Official)
vue3【2024版】开发环境搭建(含官网和nvm下载切换最新版node,修改node下载源,创建项目,启动项目,安装vscode插件Vue - Official)
300 3
|
5月前
|
JavaScript 索引
vscode中快捷生成自定义vue3模板
vscode中快捷生成自定义vue3模板
335 1