(英文版)VScode一键生成.vue模板
1. 安装vscode,官网地址
2.安装一个插件,识别vue文件
插件库中搜索Vetur,下图中的第一个,点击安装(Install)

3.新建代码片段
点击Code(代码)-Preferences(首选项)-User Snippers(用户代码片段)

4. 搜索框中输入:vue.json.
- 如果可以搜到vue.json,请把下列代码粘贴进该文件中。
{
"Print to console": {
"prefix": "vue",
"body": [
"<template>",
" <div>\n",
" </div>",
"</template>\n",
"<script>",
" export default {",
" data () {",
" return {\n",
" }",
" },",
" components: {\n",
" }",
" }",
"</script>\n",
"<style>\n",
" ",
"</style>",
"$2"
],
"description": "Log output to console"
}
}
- 如果搜索不到vue.json文件,请新建文件,命名为vue.json。
以我的为例,原本是没有vue.json文件的,点击vue-html.json文件,把下列代码粘贴进该文件中
{
"Print to console": {
"prefix": "vue",
"body": [
"<template>",
" <div>\n",
" </div>",
"</template>\n",
"<script>",
" export default {",
" data () {",
" return {\n",
" }",
" },",
" components: {\n",
" }",
" }",
"</script>\n",
"<style>\n",
" ",
"</style>",
"$2"
],
"description": "Log output to console"å
}
}
输入快捷键:ctrl+shift+s(另存为),取名vue.json

5. 上面代码中的 "prefix": "vue", 就是快捷键;保存好之后,新建.vue结尾的文件试试
输入vue,按tab键,即可一键生成vue模板。

(英文版)VScode一键生成.vue模板的更多相关文章
- 【vsCode】识别.vue/一键生成.vue模板文件
1.安装插件Vetur 结果 ---> .vue代码识别彩标 2.配置.vue文件模板,以便快速一键生成格式化 2.1新建代码片段 File->Preferences->User S ...
- VSCode 初次写vue项目并一键生成.vue模版
VSCode 写vue项目一键生成.vue模版 1.新建代码片段 文件-->首选项-->用户代码片段-->点击新建代码片段--取名vue.json 确定 2.配置快捷生成的vue模板 ...
- VSCode 快速生成.vue基本模板、发送http请求模板
安装vscode 官网:https://code.visualstudio.com/ 安装 Vetur 插件,识别 vue 文件 插件库中搜索Vetur,点击安装,安装完成之后点击重新加载 新建代码片 ...
- VSCode 快速生成 .vue 模版
VSCode 快速生成 .vue 模版 安装vscode 官网:https://code.visualstudio.com/ 安装 Vetur 插件,识别 vue 文件 插件库中搜索Vetur,点击安 ...
- vs code 快速生成vue 模板
vs code 快速生成vue 模板 1.使用快捷Ctrl + Shift + P唤出控制台,然后输入snippets并选择.(或 文件>首选项>用户代码片断里面,输入 vue.json ...
- vsc 自定义快速生成vue模板
1.安装vscode 官网地址:https://code.visualstudio.com/ 2.安装一个插件,识别vue文件 插件库中搜索Vetur,下图中的第一个,点击安装,安装完成之后点击重新加 ...
- vscode快速生成html模板(vscode快捷键"!"生成html模板)
问题: 在vscode中新建test.html, 内容是空白的,输入"!",然后按tap键 ,没有生成常见的html模板,也就是如下: 输入! html html:5 DOCTYP ...
- [小tips]使用vscode,根据vue模板文件生成代码
本着苍蝇虽小也是肉的精神...... 目标: 我们希望每次新建.vue文件后,VSCODE能够根据配置,自动生成我们想要的内容. 方法: 打开VSCODE编辑器,依次选择"文件 -> ...
- 在vscode中快速生成vue模板
点击文件-->首选项-->用户代码片段-->输入vue,此时会打开vue.json文件,将下列代码复制进文件保存即可,新建一个vue文件,输入vue回车即可生成模板,$0表示生成模板 ...
随机推荐
- 2018-2019-2 网络对抗技术 20165308 Exp1 PC平台逆向破解
2018-2019-2 网络对抗技术 20165308 Exp1 PC平台逆向破解 NOP, JNE, JE, JMP, CMP汇编指令的机器码 NOP汇编指令:执行到NOP指令时,CPU仅仅当做一个 ...
- 解决Tomcat的IllegalArgumentException: Control character in cookie value or attribute错误
接口中带有中文,tomcat8 17-Apr-2019 13:21:23.734 严重 [http-nio-8082-exec-2] org.apache.coyote.http11.Abstract ...
- [转]Linux编译和安装boost库
1. 下载boost安装包并解压缩 到http://www.boost.org/下载boost的安装包,以boost_1_58_0.tar.gz为例 下载完成后进行解压缩: tar zxvf boos ...
- .NET版本与CLR版本及兼容性
WIN7原生的.net是2.0和3.5,打开和关闭windows功能里面可以看到.另外C:\Windows\Microsoft.NET\Framework下面也能看到..net framework1. ...
- xampp启动MySQL出现Error: MySQL shutdown unexpectedly.
20175227张雪莹 2018-2019-2 <Java程序设计> xampp启动MySQL出现Error: MySQL shutdown unexpectedly. 问题 本周在学习教 ...
- json2.js JSON解析程序
源码: /* http://www.JSON.org/json2.js 2010-03-20 Public Domain. NO WARRANTY EXPRESSED OR IMPLIED. USE ...
- nvidia驱动自动更新版本后问题解决 -- failed to initialize nvml: driver/library version mismatch
因为必须关闭桌面窗口, 建议另外一台电脑ssh连接操作 1. 卸载旧版本并关闭图形界面 sudo apt-get remove --purge nvidia-\* sudo service light ...
- centos7安装mysql,以及设置root密码
1.首先进入mysql官网的下载-社区https://dev.mysql.com/downloads/ 2.点击下载后,切换版本5.7(这里的版本对于rpm没有作用),然后在新的页面中选择操作系统 3 ...
- 一个故事带你理解if __name__ == '__main__'
如果你刚刚接触python,相信会在看别人的程序的时候会遇到if __name__ == '__main__'酱紫的语法,如果当时没看懂现在也一知半解的话,看下去,本文可以帮你解决这个问题. 大家都知 ...
- python 学习第一天
第一天接触python,首先感谢老男孩的授课老师!!!! 今天的知识点: 1.首先接触到python的第一个模块getpass(这边有点迷茫,不能确定的是这个getpasss是一个库还是一个模块)ge ...