编辑自己的代码片段

  1. ctrl+shift+p

  2. 输入snippet

  3. 选择 'Preferences: Configure User Snippets'

  4. 输入vue

  5. 选择vue.json,会打开vue.json文件

  6. 在文件中输入以下代码

    {
    "vue-template": {
    "prefix": "vue",
    "body": [
    "<template>",
    " <div class=\"\">",
    "",
    " </div>",
    "</template>",
    "",
    "<script>",
    "export default {",
    " name: '',",
    " data() { ",
    " return {",
    "",
    " }",
    " },",
    " props: {",
    "",
    " },",
    " components:{",
    " },",
    " mounted() {",
    "",
    " },",
    " methods:{",
    "",
    " },",
    " }",
    "</script>",
    "",
    "<style lang=\"less\" scoped>",
    " .$1{",
    "",
    " }",
    "</style>" ],
    "description": "my vue template"
    }
    }

使用代码片段

  1. 新建vue文件
  2. 打开刚刚新建的vue文件
  3. 输入vue,会有提示,回车即可

VSCode-VUE模板文件的更多相关文章

  1. [小tips]使用vscode,根据vue模板文件生成代码

    本着苍蝇虽小也是肉的精神...... 目标: 我们希望每次新建.vue文件后,VSCODE能够根据配置,自动生成我们想要的内容. 方法: 打开VSCODE编辑器,依次选择"文件 -> ...

  2. webpack4.x加vue模板文件简单还原vue-cli

    1.首先 npm init -y 创建一个项目 2.安装vue npm install vue --save 3.然后安装webpack 注意如果全局没有还要安装全局的webpack和webpack- ...

  3. 【vsCode】识别.vue/一键生成.vue模板文件

    1.安装插件Vetur 结果 ---> .vue代码识别彩标 2.配置.vue文件模板,以便快速一键生成格式化 2.1新建代码片段 File->Preferences->User S ...

  4. 基于VSCode的vue单文件组件模板设置---一次设置,可爽终生

    第一步: 第二步: 第三步: 打开vue.json文件后,如果是初次设置,应该如下图所示,绿色注释部分不用管,注意那两个白色大括号 第四步:在大括号内全部粘贴如下代码,保存即可完成vue模板的设置 & ...

  5. (英文版)VScode一键生成.vue模板

    1. 安装vscode,官网地址 2.安装一个插件,识别vue文件 插件库中搜索Vetur,下图中的第一个,点击安装(Install) 3.新建代码片段 点击Code(代码)-Preferences( ...

  6. 小白学习VUE第二课:环境搭建 VUE Node.js VSCode template模板

    环境搭建 VUE Node.js VSCode template模板: 首先安装node:http://www.runoob.com/nodejs/nodejs-install-setup.html ...

  7. vscode写vue模板--代码片段

    Ctrl+Shift+P打开命令输入 snippet (打开用户代码片段) 在输入vue(选择代码片段的语言) 如果搜索不到,安装一个插件 vueHelper 如果搜索到复制粘贴以下代码 { &quo ...

  8. vscode自定义vue模板代码

    File--->preference -->user Snippets-->搜索html.json 编辑 加入以下自定义代码内容 "Html5-Vue": { & ...

  9. 使用vscode快速建立vue模板

    当我们希望每次新建.vue文件后,vscode能够根据配置,自动生成我们想要的内容. 打开vscode编辑器,依次选择“文件 -> 首选项 -> 用户代码片段”,此时,会弹出一个搜索框,我 ...

  10. 在vscode中快速生成vue模板

    点击文件-->首选项-->用户代码片段-->输入vue,此时会打开vue.json文件,将下列代码复制进文件保存即可,新建一个vue文件,输入vue回车即可生成模板,$0表示生成模板 ...

随机推荐

  1. CentOS7/RHEL6下,如何查看目录与子目录大小

    原文:CentOS7/RHEL6下,如何查看目录与子目录大小 通过强大的[du]命令,可以帮助我们快捷的查看目录的大小,非常实用. du命令用来查看目录或文件所占用磁盘空间的大小.常用选项组合为:du ...

  2. 修改win7 iis上传文件大小限制200KB

    win7 iis 修改上传限制,需要修改2个地方: 1,“双击“Internet 信息服务(IIS)管理器”中的“ASP”– 打开“配置 ASP 应用程序的属性”–展开“限制属性”:修改“最大请求实体 ...

  3. C# 高低位获取

    ushort Tbed = 2255; byte gao = (byte)(Tbed >> 8); byte di = (byte)(Tbed & 0xff); ushort a ...

  4. Java Web 深入分析(8) Servlet工作原理解析

    Servlet Servlet(Server Applet)是Java Servlet的简称,称为小服务程序或服务连接器,用Java编写的服务器端程序,主要功能在于交互式地浏览和修改数据,生成动态We ...

  5. 【原创】大叔经验分享(87)marathon重启应用过程服务不可用

    marathon提供多种健康检查方式 常用的有TCP和HTTP, TCP检查端口是否存在,存在则认为实例健康: HTTP检查指定URL的HTTP返回码,返回码正常(2xx.3xx)则认为实例健康: 这 ...

  6. Unity使用Resources读取Resources路径下的二进制文件(Binary Data)必须使用 .bytes扩展名

    将某二进制文件放在Resources目录下,希望用Resources.Load<TextAsset>的方式读取,发现TextAsset是null 查阅Unity文档得知,使用Resourc ...

  7. Vue页面手动刷新,导航栏激活项还原到初始状态问题解决方案

    场景描述:在页面中存在顶部导航和左侧导航,左侧导航和右侧内容区使用了命名视图实现,点击左侧导航的链接时,右侧内容区相应显示不同组件内容.问题:在当前链接手动刷新浏览器(例如:浏览器地址为/enterp ...

  8. ccs编译.lib

    新建 New一个CCS Project Output type选择"Static Library" 添加源文件 右击工程 -> Add Files- 编译 编译生成的.lib ...

  9. CentOS linux7 设置开机启动服务

    常用命令 描述                                 旧命令  新命令 使服务自动启动          chkconfig --level 3 http on  syste ...

  10. SpringCloud各个组件通俗解析

    https://www.cnblogs.com/lonelyJay/p/9936241.html