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( ...
随机推荐
- table中JS选取行列
<table border="1" align="center" style="width: 500px" id="doct ...
- PID28 [Stupid]愚蠢的宠物
题链:https://www.rqnoj.cn/problem/28 题目描述 背景 大家都知道,sheep有两只可爱的宠物(一只叫神牛,一只叫神菜).有一天,sheep带着两只宠物到狗狗家时,这两只 ...
- java字符串利用正则表达式分割
平时用到,整理的,总感觉缺点什么: private String getKeywordByContent(String content) { StringBuffer sbAllKwyword = n ...
- 接口测试工具-fiddler的运用
本篇主要介绍一下fiddler的基本运用,包括查看接口请求方式,状态响应码,如何进行接口测试等 一.Fiddler的优点 独立的可以直接抓http请求 小巧.功能完善 快捷.启动就行 代理方便 二.什 ...
- xtu summer individual-4 D - Martian Strings
Martian Strings Time Limit: 2000ms Memory Limit: 262144KB This problem will be judged on CodeForces. ...
- Codeforces Round #258 (Div. 2) D
D. Count Good Substrings time limit per test 2 seconds memory limit per test 256 megabytes input sta ...
- PHP $_SERVER的使用
常常会用到php的$_SERVER变量,可是好多常用的参数又不熟每次都去查手册.为了记住一些常用的,写个日志吧.前导:网站根目录:/www/domain.com/访问Url:http://www.do ...
- 对于事务ACID的理解
ACID,即以下四点: 原子性(Atomicity) 原子性是指事务是一个不可分割的工作单位,事务中的操作要么都发生,要么都不发生. 一致性(Consistency) 事务前后数据的完整性必须保持一致 ...
- MongoDB小结03 - insert、remove
连接MongoDB(bin目录下) ./mongo 如果觉得shell里空空的可以输入help,在刷屏的同时大致了解下有哪些方法 help 现在咱们还没有数据库,咱们创建一个,任性起名:templat ...
- jmeter的Classpath即类或者jar包的搜索路径设置
对于master-slave模式,插件和依赖都需要放到slave上才能生效,并且需要重启slave使插件生效 查看配置文件:apache-jmeter-3.1/bin/jmeter.propertie ...