快捷键

解释快捷键（mac）快捷键（win）
注释command+/Ctrl+/
快速生成网页html:5html:5
代码格式化Shift+Alt+FShift+Alt+F
向上或向下复制一行Shift+option+Up 或 Shift+option+DownShift+Alt+Up 或 Shift+Alt+Down
在当前行下方插入一行command+EnterCtrl+Enter
在当前行上方插入一行command+Shift+EnterCtrl+Shift+Enter
万能键：打开命令面板。在打开的输入框内，可以输入任何命令command+Shift+PF1 或 Ctrl+Shift+P
查找command+FCtrl+F
查找替换Command + Option + FCtrl+H
删除整行Command +Shift+KCtrl+Shift+K

键盘快捷方式查看与修改 ctrl+K ctrl+S

j5Z6PJ.png

插件

Live Sever

为静态和动态页面启动具有实时重载特性的本地开发服务器。

补充：手机和电脑同一网络下，通过IP地址（win：ipconfig/mac：ifconfig或点击网络查看）可以实现手机端访问 。

Live Preview

j5ZWKx.png

open in browser

Prettier - Code formatter

代码格式化

JavaScript · TypeScript · Flow · JSX · JSON
CSS · SCSS · Less
HTML · Vue · Angular HANDLEBARS · Ember · Glimmer
GraphQL · Markdown · YAML

补充：html格式化有些问题。

Markdown Preview Enhanced

j5Z5VO.png

Code Runner代码运行器

一键运行多种语言运行代码片段或代码文件: c，c + + ，Java，JavaScript，PHP，Python，Perl，Perl 6，Ruby，Go，Lua，Groovy，PowerShell，BAT/CMD，BASH/SH，f # Script，f # (。NET 核心) ，c # 脚本，多到你想不到。

快捷键 win:Ctrl+Alt+Nmac:Control+Alt+N

GitLens

功能更加强大，无缝导航和浏览 Git 存储库。

JSON to TS

json转为TS申明

从剪贴板转换

快捷键：win:Shift + Ctrl + Alt + V mac:shift+control+option+v

命令面板：clipboard

从选择转换

快捷键：win:Shift + Ctrl + Alt + S mac:shift+control+option+s

JSON5 syntax

ES7+ React/Redux/React-Native snippets

Basic

PrefixMethod
imp→import moduleName from 'module'
imn→import 'module'
imd→import { destructuredModule } from 'module'
ime→import * as alias from 'module'
ima→import { originalName as aliasName} from 'module'
exp→export default moduleName
exd→export { destructuredModule } from 'module'
exa→export { originalName as aliasName} from 'module'
enf→export const functionName = (params) => { }
ednf→export default function functionName(params) { }
fre→arrayName.forEach(element => { }
fof→for(let itemName of objectName { }
fin→for(let itemName in objectName { }
nfn→const functionName = (params) => { }
sti→setInterval(() => { }, intervalTime
sto→setTimeout(() => { }, delayTime
prom→return new Promise((resolve, reject) => { }
cmmb→comment block

Console

PrefixMethod
clg→console.log(object)
clo→console.log('object', object)
ctm→console.time('timeId')
cte→console.timeEnd('timeId')

React Components

rcc

1
2
3
4
5
6
7
import React, { Component } from 'react'

export default class FileName extends Component {
  render() {
    return <div>$2</div>
  }
}

rafce

1
2
3
4
5
6
7
import React from 'react'

const $1 = () => {
  return <div>$0</div>
}

export default $1

Others

cmmb

1
2
3
4
5
/**
|--------------------------------------------------
| $1
|--------------------------------------------------
*/

Vue 3 Snippets

Chinese (Simplified) (简体中文)

koroFileHeader

fileheader win：ctrl+win+i mac:control+command+i

cursortip win ：ctrl+win+t mac:control+command+t

Import Cost

依赖包大小提示

REST Client

j5y0aV.png