File---》preference --》user Snippets--》搜索html.json 编辑 加入以下自定义代码内容

"Html5-Vue": {

    "prefix": "vue",

    "body": [

        "<!DOCTYPE html>",

        "<html lang=\"zh-CN\">\n",

        "<head>",

        "\t<meta charset=\"UTF-8\">",

        "\t<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">",

        "\t<meta http-equiv=\"X-UA-Compatible\" content=\"ie=edge\">",

        "\t<title>Document</title>",

        "\t<script src=\"../lib/vue-2.5.17/vue.js\"></script>",

        "</head>\n",

        "<body>",

        "\t<div id=\"app\">$1</div>\n",

        "\t<script>",

        "\t\tvar vm = new Vue({",

        "\t\t\tel: '#app',",

        "\t\t\tdata: {},",

        "\t\t\tmethods: {}",

        "\t\t});",

        "\t</script>",

        "</body>\n",

        "</html>"

    ],

    "description": "快速创建在html5编写的vue模板"

}

新建html文件后  输入：vue 然后按tab 就出来自定义代码

vscode自定义vue模板代码的更多相关文章

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

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

  2. VSCode 自定义Vue snippets, 快速生成Vue模板

    命令行 Ctrl+Shift+P # 选择 Configure User Snippets # 选择 Vue.json 原始的Vue.json { // Place your snippets for ...

  3. vscode 的 vue模板

    12 { "Print to console": { "prefix": "vue", "body": [ " ...

  4. Vscode 格式化vue Template代码段

    1.安装 vetur 2.在User Setting中增加设置: "vetur.format.defaultFormatter.html": "js-beautify-h ...

  5. （英文版）VScode一键生成.vue模板

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

  6. 团队协作统一vue代码风格，vscode做vue项目时的一些配置

    1. 安装Vetur 扩展 主要是用于让vscode能识别vue文件,对vue代码进行高丽处理,并且它内置了一些代码格式化的设置 2. 安装ESLint 如果你的项目已经开启了eslint规范, 再有 ...

  7. vsc 自定义快速生成vue模板

    1.安装vscode 官网地址:https://code.visualstudio.com/ 2.安装一个插件,识别vue文件 插件库中搜索Vetur,下图中的第一个,点击安装,安装完成之后点击重新加 ...

  8. vscode之快速生成vue模板

    文件-首选项-用户代码片段-搜索“vue”点击进入vue.json 复制这个片段 { "Vue component": { "prefix": "vu ...

  9. 在pycharm中自定义模板代码,快速输出固定代码块

    pycharm中有时会经常输出固定一段代码,为避免每次重复输入,可以自定义一段模板代码,请看以下图教程: 1.  点击 file   里面的   setting 2. 在搜索框输入live,就会显示出 ...

随机推荐

  1. 【STM32H7教程】第31章 STM32H7的USART应用之RS485

    完整教程下载地址:http://www.armbbs.cn/forum.php?mod=viewthread&tid=86980 第31章       STM32H7的USART应用之RS48 ...

  2. spring cloud 2.x版本 Sleuth+Zipkin分布式链路追踪

    前言 本文采用Spring cloud本文为2.1.8RELEASE,version=Greenwich.SR3 本文基于前两篇文章eureka-server.eureka-client.eureka ...

  3. glibc编译安装

    glibc是gnu发布的libc库,即c运行库.glibc是linux系统中最底层的api,几乎其它任何运行库都会依赖于glibc.glibc除了封装linux操作系统所提供的系统服务外,它本身也提供 ...

  4. 关于WIN7下IE8IE7浏览器无法安装微信支付商户证书的解决方案

    关于WIN7下IE8IE7浏览器无法安装微信支付商户证书的解决方案 解决方案就是使用 chrome浏览器 默认的chorme浏览器  打开微信商户平台 会提示让安装控件  然后反复安装 其实要解决这个 ...

  5. Flask笔记：信号机制

    Flask中有内置的一些信号,也可以通过三方库blinker自定义信号,其实Flask内置的信号也是优先使用的blinker库,如果没有安装blinker才会使用自定义的信号机制.可以通过点击任意导入 ...

  6. javascript常用数据验证函数

    正则表达式日期验证函数 function CheckDate(str){       //在JavaScript中,正则表达式只能使用"/"开头和结束,不能使用双引号       ...

  7. Unity Pixel 人物设计(1)

    草稿: 目前进度:

  8. DDoS攻击工具

    DDoS攻击工具 综合性工具 综合性工具除了可以进行DDoS攻击外,还可用于其他的用途,例如:端口扫描.安全审计.防火墙等.实际上,大部分综合性工具开发的原始目的并不是用于DDoS,而是"网 ...

  9. kali linux查看局域网下所有IP，并对指定IP实施局域网内攻击(断网，随时查看对方密码，上网痕迹等)

    首先我们打开我们熟悉的kali linux操作系统,利用指令: ifconfig 来确认本机的ip地址 确认了本机的ip地址之后,利用一下的指令查看局域网下所有ip: fping -g 本机IP地址/ ...

  10. Django 的ORM 表间操作

    Django之ORM表间操作   之前完成了简单的数据库数据增加操作.这次学习更多的表间操作. 单表操作 增加 方式一 b = Book(title="Python基础", pub ...