记录下自己的开发环境
(1) 快捷键
Ctrl + p 搜索并跳转文件
Ctrl + f 文件内搜索
Ctrl + j 开关终端
Ctrl + d 选中光标内单词
Ctrl + shift + p 打开vscode命令栏
F12 转到定义
Ctrl + w 作用域内折叠 (需修改vscode按键绑定)
Ctrl + q 作用域内展开 (需修改vscode按键绑定)
(2) 配置vscode 基础设置
// setting.json
{
"editor.fontSize": 18,
"editor.defaultFormatter": "esbenp.prettier-vscode",
"files.autoSave": "afterDelay",
"workbench.colorTheme": "One Dark Pro",
"[vue]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"window.zoomLevel": 0,
"editor.formatOnSave": true
}配置vscode支持别名补全
// jsconfig.js
{
"compilerOptions": {
"baseUrl": ".",
"paths": {
"@/*": ["./src/*"]
}
}
}常用的snippets配置,scope 可以根据需要自行更改
{
"pwd": {
"prefix": "pwd",
"body": ["// $TM_FILEPATH"],
"description": "打印文件路径"
},
"common": {
"prefix": "common",
"body": ["/**", " * $0", " */"],
"description": "多行注释"
},
"canvas": {
"prefix": "canvas",
"body": ["/** @type {HTMLCanvasElement} */ "],
"description": "canvas补全类型声明"
},
"http": {
"prefix": "http",
"body": ["http://192.168.5.$0/"],
"description": "http快速生成"
},
"https": {
"prefix": "https",
"body": ["https://192.168.5.$0/"],
"description": "http快速生成"
}
}配置prettier格式化
// .prettierrc
{
"semi": false,
"singleQuote": true,
"printWidth": 120,
"jsxSingleQuote": true,
"tabWidth": 2
}
(3) 插件
Bracket Pair Colorizer 括号高亮
One Dark Pro 主题
Prettier 格式化
Live Server
open in browser
ES7 React/Redux/GraphQL/React-Native snippets
- rfc 创建函数组件
- rcc 创建类组件
- imp→import moduleName from 'module'
- imd→import { destructuredModule } from 'module'
Vetur vue模板支持
(4)软件
Snipaste
- F1 截图
- F3 固定截图
- C 取色
网易有道词典
-划词设置双击 Ctrl 翻译
