VS code 自定义快捷输入
本文是从简书复制的, markdown语法可能有些出入, 想看"正版"和更多内容请关注 简书: 小贤笔记
位置
ctrl+shift+p- 搜索:
snippets - 输入类型: 比如
html、javascript
参数说明
prefix：使用代码段的快捷入口body：需要设置的代码放在这里,字符串间换行的话使用\r\n换行符隔开.如果值里包含特殊字符需要进行转义,多行代码以","分隔(在引号后面写逗号)$0：定义最终光标位置$1：定义第一次光标位置，按tab键可进行快速切换, 还可以有$2,$3,$4,$5...description：代码段描述,在使用智能感知时的描述
常用字符说明
\\反斜杠\a警告\b退格符\f换页符\n换行符\r回车符\tTab 符\v垂直 Tab 符\u使用数字指定的Unicode 字符, 如\u2000\x使用十六进制数指定的Unicode 字符, 如\xc8\0空值
HTML
//自定义
"phone": {
"prefix": "ph",
"body": [
"<!DOCTYPE html>",
"<html lang='en'>",
"<head>",
" <meta charset='UTF-8'>",
" <meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'>",
" <meta name='viewport' content='width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0'/>",
" <title>Titile</title>",
"</head>",
"<body>",
"<script type='text/javascript'>",
" $('html').css({fontSize:$(window).width()/375*100 + 'px'});",
" $('body').css({minHeight:$(window).height()});",
"</script>",
"</body>",
"</html>"
],
"description": "script"
},
"script": {
"prefix": "sc",
"body": [
"<script type='text/javascript' src='$1'></script>"
],
"description": "script"
}
JavaScript
// 自定义
"function": {
"prefix": "fn",
"body": [
"function$1($2) {\r\n\t$3\r\n}"
],
"description": "function(){}"
},
"console.log": {
"prefix": "co",
"body": [
"console.log ($1);"
],
"description": "console.log()"
},
"alert": {
"prefix": "al",
"body": [
"alert ($1);"
],
"description": "alert()"
},
"class": {
"prefix": "cl",
"body": [
"$('.$1')"
],
"description": "class"
},
"id": {
"prefix": "id",
"body": [
"$('#$1')"
],
"description": "id"
},
"on": {
"prefix": "on",
"body": [
"on ('click',function () {\r\n\t$1\r\n})"
],
"description": "on"
},
"for": {
"prefix": "fo",
"body": [
"for (let i=0; i<$1; i++) {\r\n\t$2\r\n}"
],
"description": "for"
},
"if": {
"prefix": "ifif",
"body": [
"if ($1) {\r\n\t$2\r\n}"
],
"description": "if"
},
"ifElse": {
"prefix": "ifel",
"body": [
"if ($1) {\r\n\t$2\r\n} else {\r\n\t$3\r\n}"
],
"description": "ifElse"
},
"ajax": {
"prefix": "aj",
"body": [
// "$.ajax({\r\n\turl:$1,\r\n\tdata:{\r\n\t\t$2\r\n\t},\r\n\ttype:'post',\r\n\tdataType:'JSON',\r\n\tsuccess:function (res) {\r\n\t\t$3\r\n\t}\r\n})"
"$.ajax({",
" url: $1,",
" data:{",
" $2",
" },",
" type: 'post',",
" dataType: 'JSON',",
" success:function (res) {",
" $3",
" }",
"})"
],
"description": "ajax"
},
"axios": {
"prefix": "ax",
"body": [
"axios.$1(__PROJECTPATH__ + `$2`, {",
" $3",
"})",
".then(function (response) {",
" console.log(response);",
"})",
".catch(function (error) {",
" console.log(error);",
"});",
],
"description": "axios"
}
Vue
注: 组件/实例的书写顺序参照 Vue 风格指南
// 自定义(移动端)
"vue": {
"prefix": "vu",
"body": [
"<!-- $1 -->",
"<template>",
" <div>",
" $2",
" </div>",
"</template>",
"",
"<script>",
" export default {",
" name: '',",
" components: {",
" ",
" },",
" props: {",
" ",
" },",
" data() {",
" return {",
" ",
" }",
" },",
" computed: {",
" ",
" },",
" watch: {",
" ",
" },",
" created() {",
" ",
" },",
" methods: {",
" ",
" },",
" }",
"</script>",
"",
"<style scoped lang='less'>",
" ",
"</style>"
],
"description": "Vue templet"
}
VS code 自定义快捷输入的更多相关文章
- Idea 自定义快捷代码输入 如syso => System.out.println()
前言 之前一直用的Eclipse System.out.println()的快捷代码输入 是 syso,但是在Idea 不好使用了,后来搜索了一番才知道,在Idea中的快捷输入是 sout,这里我就想 ...
- 135_Power Query M语言快捷输入之输入法设置自定义短语
博客:www.jiaopengzi.com 焦棚子的文章目录 请点击下载附件 一.背景 因为工作原因,把电脑重装了下,当敲M的时候总感觉那里不对.原来是我的M自定义短语没有同步.由于我的自定义短语还是 ...
- js快捷输入日期
点击这里查看效果http://keleyi.com/keleyi/phtml/jstexiao/10.htm 以下式代码: <!DOCTYPE html> <html> < ...
- Eclipse 快捷键 快捷输入
快捷键: 1. ctrl+shift+r:打开资源 这可能是所有快捷键组合中最省时间的了.这组快捷键可以让你打开你的工作区中任何一个文件,而你只需要按下文件名或mask名中的前几个字母,比如appli ...
- Mac Oracle SqlDeveloper 快捷输入
用惯了 plsql 的快捷输入,换了 Mac Oracle SqlDeveloper反倒是找不到了,翻出去找了几次终于找到 SqlDeveloper -- preferences -- 数据库(dat ...
- PL/SQL语句快捷输入设置
设置PL/SQL语句快捷输入的方法,让你成为高效率的人. 1.打开PL/SQL,输入用户并登录 2.并打开Tools->Preferences->Editor->AutoReplac ...
- 教你一招：在PowerPoint中自定义可输入文本的占位符
日常生活中,当我们设计多媒体课件时,默认的版式其实已经够用了.但是,很多时候,我们需要更加个性一点,所以,我们需要自定义很多东西.本文介绍在PowerPoint中自定义可输入文本的占位符. 一.占位符 ...
- VSCode中快捷输入HTML代码
VSCode中有一些快捷编辑HTML的方法,能大大提高工作效率,在这记录一些. 1.输入html:5,然后按tab键或enter键,效果如下: <!-- 输入html或者html:5生成页面模板 ...
- Settings > Editor > Live Templates 中自定义快速输入
Settings > Editor > Live Templates 中自定义快速输入
随机推荐
- iOS8 dismissViewControllerAnimated:YES在Show Segue不工作
最近使用iOS8 Sdk(xcode6.1.1)使用Show Segue功能,V_A视图push到V_B视图,然后想通过使用按键返回V_A,我记得ios6的时候可以使用[self dismissVie ...
- vue.js学习笔记(一)——vue-cli项目的目录结构
vue.js是一套构建用户界面的渐进式框架.vue采用自底向上增量开发的设计.vue的核心库只关心视图层,非常容易学习,非常容易与其它库和已有项目整合.vue完全有能力驱动采用单文件组件和vue生态系 ...
- js 面向对象 定时器 046
获取DOM对象补充 document.getElementsByTagName('div'); //获取的多个DOM对象 这种对象叫伪数组 如果想遍历此对象 通过for(var i=0; i < ...
- mysql安装启动 ERROR 1045 (28000): Access denied for user 'root'@'localhost' (using password: NO)
首次安装mysql 启动 mysql -uroot 以下错误: ERROR 1045 (28000): Access denied for user 'root'@'localhost' (using ...
- iview modal对话框的一个小知识点
我在做一个项目的一个页面的时候有两个弹窗,发现点击一个弹窗的右上角关闭按钮后,打开另一个弹窗的时候,另一个弹窗里面带有上一个弹窗里的样式内容,说明上一个弹窗并没有被销毁. 后来发现modal源码里的c ...
- HTML页面中嵌入SVG
HTML页面中嵌入SVG的几种方式 你有N种理由使用SVG在页面中展示图像,如它的矢量特性.广泛的浏览器支持.比JPEG和PNG更小的体积.可用CSS设置外观.使用DOM API操作以及各种可用的SV ...
- web渗透笔记
1.安装nmap记录:(1)下载:wget http://nmap.org/dist/nmap-6.46.tar.bz2(最新版)wget http://nmap.org/dist/nmap-6.00 ...
- IT自由职业者的第一个月（上）——何去何从
2016年8月11号,我终于走完所有流程,拿到了离职证明,5年的嵌入式驱动开发工程师的职业生涯就此结束.走离职流程期间,陆续有同事和朋友问我,离职后去哪儿,我都是告诉他们:“还没想好,离了再 ...
- [转]Using $select, $expand, and $value in ASP.NET Web API 2 OData
本文转自:https://docs.microsoft.com/en-us/aspnet/web-api/overview/odata-support-in-aspnet-web-api/using- ...
- vue 报错./lib/html5-entities.js, this relative module was not found
今天在做项目一直都挺正常的,我稍微休息一下回来就报这个错,我百度了半天也没找到答案.然后我只能重新安装vue-cli,奇迹发生了错误没有,然后我又休息了一会发现有报错了.气炸了都. 话不多多说直接上图 ...