vs code 快速生成vue 模板
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 模板的更多相关文章
- 关于vs code 快速生成vue 模板
在 文件>首选项>用户代码片断里面,打开vue.json 添加以下代码: "Print to console": { "prefix": " ...
- VS code快速创建vue模板
忘记了.vue文件的格式或者不想手动敲那段模板代码怎么办?VS code快速创建vue模板帮你偷个小懒 第一步:新建模板并保存 打开 VS code,依次点击 file > Preference ...
- vsc 自定义快速生成vue模板
1.安装vscode 官网地址:https://code.visualstudio.com/ 2.安装一个插件,识别vue文件 插件库中搜索Vetur,下图中的第一个,点击安装,安装完成之后点击重新加 ...
- 在vscode中快速生成vue模板
点击文件-->首选项-->用户代码片段-->输入vue,此时会打开vue.json文件,将下列代码复制进文件保存即可,新建一个vue文件,输入vue回车即可生成模板,$0表示生成模板 ...
- vscode之快速生成vue模板
文件-首选项-用户代码片段-搜索“vue”点击进入vue.json 复制这个片段 { "Vue component": { "prefix": "vu ...
- VSCode 自定义Vue snippets, 快速生成Vue模板
命令行 Ctrl+Shift+P # 选择 Configure User Snippets # 选择 Vue.json 原始的Vue.json { // Place your snippets for ...
- VSCode 快速生成.vue基本模板、发送http请求模板
安装vscode 官网:https://code.visualstudio.com/ 安装 Vetur 插件,识别 vue 文件 插件库中搜索Vetur,点击安装,安装完成之后点击重新加载 新建代码片 ...
- VSCode 快速生成 .vue 模版
VSCode 快速生成 .vue 模版 安装vscode 官网:https://code.visualstudio.com/ 安装 Vetur 插件,识别 vue 文件 插件库中搜索Vetur,点击安 ...
- (英文版)VScode一键生成.vue模板
1. 安装vscode,官网地址 2.安装一个插件,识别vue文件 插件库中搜索Vetur,下图中的第一个,点击安装(Install) 3.新建代码片段 点击Code(代码)-Preferences( ...
随机推荐
- 正则表达式 整理(\w \s \d 点 贪婪匹配 非贪婪匹配 * + ? {} | [] ^ $ \b 单词边界 分组、re.findall()、re.split()、re.search()、re.match()、re.compile()、re.sub())
re.findall 匹配到正则表达式的字符,匹配到的每个字符存入一个列表,返回一个匹配到的所有字符列表 一. 匹配单个字符 import re # \w 匹配所有字母.数字.下划线 re.find ...
- 4_蒙特卡罗算法求圆周率PI
题目 蒙特卡罗算法的典型应用之一为求圆周率PI问题. 思想: 一个半径r=1的圆,其面积为:S=PI∗r2=PI/4 一个边长r=1的正方形,其面积为:S=r2=1 那么建立一个坐标系,如果均匀的向正 ...
- The Text Splitting (将字符串分成若干份,每份长度为p或q)
Description You are given the string s of length n and the numbers p, q. Split the string s to piece ...
- 全文搜索(AB-2)-权重
概念 权重是一个相对的概念,针对某一指标而言.某一指标的权重是指该指标在整体评价中的相对重要程度.权重是要从若干评价指标中分出轻重来,一组评价指标体系相对应的权重组成了权重体系. 释义 等同于比重 ...
- MySQL数据库:SQL语句基础、库操作、表操作、数据类型、约束条件、表之间的关系
数据库相关概念: 1. 数据库服务器:运行数据库管理软件的计算机 2. 数据库管理软件:MySQL.Oracle.db2.slqserver 3. 库:文件夹,用来组织文件/表 4. 表:文件(类似于 ...
- 序列终结者(bzoj 1521)
Description 网上有许多题,就是给定一个序列,要你支持几种操作:A.B.C.D.一看另一道题,又是一个序列 要支持几种操作:D.C.B.A.尤其是我们这里的某人,出模拟试题,居然还出了一道这 ...
- msp430入门学习20
msp430的USART模式 msp430入门学习
- vue生成包报错error from UglifyJs
mangle: { keep_fnames: true},
- IntelliJ IDEA在行尾增加分号
IntelliJ IDEA在行尾增加分号 Ctrl+Shift+Enter - 本身的含义是自动完成,如果需要的话,会在行尾添加分号:
- ORA-00942:表或视图不存在 低级错误一例
ORA-00942:表或视图不存在 低级错误一例 运行查询语句,报ORA-00942错误 检查后发现没有指定表的所属用户.加入用户.再次查询,查询正常,截图例如以下: *************** ...