vs code 快速生成vue 模板

1.使用快捷Ctrl + Shift + P唤出控制台,然后输入snippets并选择。(或 文件>首选项>用户代码片断里面,输入 vue.json ,然后回车 )(或 file > Preferences > User Snippets,当弹出搜索框之后,输入 vue.json ,然后回车)

2.接着输入vue,vs code自动生成vue.json文件。

3.将vue.json文件改为下面得模板(可根据个人需求修改当中的模板内容)

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

然后新建一个 aaa.vue 文件,输入“vue”,按下回车键或者Tab键,模板就自动生成了:

是不是很实用和方便呢

vs code 快速生成vue 模板的更多相关文章

  1. 关于vs code 快速生成vue 模板

    在 文件>首选项>用户代码片断里面,打开vue.json 添加以下代码: "Print to console": { "prefix": " ...

  2. VS code快速创建vue模板

    忘记了.vue文件的格式或者不想手动敲那段模板代码怎么办?VS code快速创建vue模板帮你偷个小懒 第一步:新建模板并保存 打开 VS code,依次点击 file > Preference ...

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

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

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

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

  5. vscode之快速生成vue模板

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

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

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

  7. VSCode 快速生成.vue基本模板、发送http请求模板

    安装vscode 官网:https://code.visualstudio.com/ 安装 Vetur 插件,识别 vue 文件 插件库中搜索Vetur,点击安装,安装完成之后点击重新加载 新建代码片 ...

  8. VSCode 快速生成 .vue 模版

    VSCode 快速生成 .vue 模版 安装vscode 官网:https://code.visualstudio.com/ 安装 Vetur 插件,识别 vue 文件 插件库中搜索Vetur,点击安 ...

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

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

随机推荐

  1. SQL-如何使用 MongoDB和PyMongo。

    先决条件 在开始之前,请确保已经安装了 PyMongo 发行版. 在 Python shell 中,下面的代码应该在不引发异常的情况下运行: >>> import pymongo 假 ...

  2. 第七章习题G题

    题意 给出如图案例,要你从某一点开始走,一直走到极限(即无法再进行扩展),这时你走过的点会连成一个数,不同的走法当然会有不同的数,要求是输出最大的数(注意每个方块走过一次就不能再走) 思路 •1.枚举 ...

  3. 创建私有 Gems 源

    1.安装依赖 yum install gem -y gem install builder   2.安装.配置nginx的文件列表 添加/etc/nginx/default.d/mirrors.con ...

  4. POJ-20407Relatives/NYOJ-333mdd的烦恼,欧拉函数简单应用,模板A

     poj                         Relatives                                Time Limit: 1000MS   Memory Li ...

  5. Linux笔记:定时任务和文件操作

    查看定时任务 crontab -l 注册定时任务 crontab -e然后就像 vim 一样编辑自己的定时任务.如: * * * * * . /home/hadoop/timer/check_job. ...

  6. [luoguP1970] 花匠(DP)

    传送门 n2 过不了惨啊 70分做法 f[i][0] 表示第 i 个作为高的,的最优解 f[i][0] 表示第 i 个作为低的,的最优解 (且第 i 个一定选) 那么 f[i+1][1]=max(f[ ...

  7. 文件权限设置与http,php的关系

    在web服务器上的文件要使用什么权限比较好呢.我开始的时候直接都是777,后台安全部门的同事,通过漏洞把我管理的服务器给搞了.报告到我这里,我才意识到权限的设置不能马虎.环境采用nginx+php,一 ...

  8. 2.3 comparator(比较器)

    1.comparator是java的一种机制,用来帮助我们给相同对象的不同属性排序 2.Comparable接口,是一个对象本身就已经支持自比较所需要实现的接口,如String,Integer自己就已 ...

  9. Uva -1515 Pool construction(最小割)

    输入一个字符矩阵,'.'代表洞,'#'代表草地.可以把草改成洞花费为d,或者把洞改成草花费为f,最后还要在草和洞之间修围栏花费为b. 首先把最外一圈的洞变成草,并累加花费. 增加一个源点和一个汇点,源 ...

  10. Servlet表单数据处理

    以下内容引用自http://wiki.jikexueyuan.com/project/servlet/form-data.html: 当需要从浏览器到Web服务器传递一些信息并最终传回到后台程序时,一 ...