前端開(kāi)發(fā)神器 VSCode 使用總結(jié)

VSCode 是微軟出品的，基于 Electron 和 TypeScript 的，集成了 git 版本管理和命令行終端，而且開(kāi)源穩(wěn)定，插件豐富，再搭配一款 Chrome 瀏覽器，可以說(shuō)是前端開(kāi)發(fā)神器了。

安裝指南

https://code.visualstudio.com

推薦插件

project manager // 項(xiàng)目管理

prettier // 自動(dòng)格式化你的代碼

gitlens // 查看 git 修改記錄

bracket pair colorizer2 // 彩色括號(hào)匹配

code spell checker // 單詞拼寫(xiě)檢查

eslint // javascript 代碼風(fēng)格檢查工具

git history // git 歷史

npm intellisense // npm 自動(dòng)補(bǔ)全

path intellisense // 自動(dòng)補(bǔ)全文件路徑

material icon theme // 好看的圖標(biāo)

highlight matching tag // 高亮匹配標(biāo)簽

better toml // toml 文件支持

auto rename tag // 自動(dòng)重命名標(biāo)簽

auto close tag // 自動(dòng)關(guān)閉標(biāo)簽

debugger for chrome // 在 chrome 里調(diào)試

visual studio intellicode // 智能補(bǔ)全

Markdown All in One // 寫(xiě) markdown 神器

ES7 React/Redux/GraphQL/React-Native snippets // react 代碼簡(jiǎn)寫(xiě)

react native tools // 寫(xiě) react native

vetur // 寫(xiě) vue

javascript(es6) code snippets // javascript 代碼簡(jiǎn)寫(xiě)

推薦快捷鍵

F1 打開(kāi)可以輸入命令

F2 重命名變量，方便重構(gòu)

F5 運(yùn)行和調(diào)試代碼

F12 去到定義的地方

shift+F12 查找所有引用

ctrl+g 會(huì)讓你輸入數(shù)字，快速定位到指定行

ctrl+enter 在下方另起一行

crtl+f 查找

ctrl+shift+n 多開(kāi)一個(gè) vscode 編輯器

ctrl+b 開(kāi)關(guān)側(cè)邊欄

ctrl+h 替換

ctrl+r 打開(kāi)最近文件

ctrl+` 終端

ctrl+tab 切換文件

ctrl+shift+e 切到資源管理器

ctrl+p 快速打開(kāi)文件

ctrl+[ 左移代碼

ctrl+] 右移代碼

ctrl+/ 行注釋

ctrl+t 匹配文本來(lái)打開(kāi)文件

ctrl+shift+t 重新打開(kāi)關(guān)閉的文件

ctrl+shift+home/end 選擇光標(biāo)左側(cè)/右側(cè)全部?jī)?nèi)容

ctrl+backspace 刪除上一個(gè)詞

ctrl+delete 刪除光標(biāo)右側(cè)的詞

ctrl+左/右 跳到上/下一個(gè)詞

ctrl+shift+左/右 逐個(gè)選詞

鼠標(biāo)滾輪或者shift+alt+鼠標(biāo)拖拽 批量選中，方塊選擇

ctrl+shift+pageup/pagedown 切換文件

ctrl+d 選中當(dāng)前詞語(yǔ)

ctrl+enter 下方插入一行

alt+左/右箭頭 跳回來(lái)/過(guò)去

alt+shift+上/下箭頭 向上/下復(fù)制行

總結(jié)

以上是生活随笔為你收集整理的vscode用鼠标滚轮_前端开发神器 VSCode 使用总结的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。