vscode使用記錄


插件

主題

Snazzy Operator

  • Oceanic Next - 我使用了 Oceanic Next (dimmed bg)
  • emedy - 我使用了 Remedy Dark (straight)

風格

vetur 針對Vue.js框架,提供代碼風格和語法提示

提高效率

Auto Rename Tag 自動修改對應標簽

在 settings.json 文件中的 auto-rename-tag.activationOnLanguage 中添加一項以設置擴展名將被激活的語言。默認情況下,它是[“ *”],將為所有語言激活。

"auto-rename-tag.activationOnLanguage": ["html", "xml", "php", "javascript"]

Bracket Pair Colorizer 2 用顏色標識匹配的括號以及括號內容

Highlight Matching Tag 突出顯示匹配的開始或結束標簽及標簽內容。

我使用的擴展的樣式:

"highlight-matching-tag.styles": {
  "opening": {
    "left": {
      "custom": {
        "borderWidth": "0 0 0 1.5px",
        "borderStyle": "solid",
        "borderColor": "yellow",
        "borderRadius": "5px",
        "overviewRulerColor": "white"
      }
    },
    "right": {
      "custom": {
        "borderWidth": "0 1.5px 0 0",
        "borderStyle": "solid",
        "borderColor": "yellow",
        "borderRadius": "5px",
        "overviewRulerColor": "white"
      }
    }
  }
}

Image preview 懸停時顯示圖像預覽。

Settings Sync 多台機器上同步vscode設置

TODO Highlight

在代碼中突出顯示 TODO,FIXME 和其他注釋。

語法補充

react es語法快捷鍵

ES7 React/Redux/GraphQL/React-Native snippets

React生成模板代碼快捷鍵

Simple React Snippets

針對js的插件,包含了js的常用語法關鍵字,很實用

JavaScript Snippet Pack

ES6生成模板代碼快捷鍵

JavaScript (ES6) code snippets

格式化

快速格式化代碼

Prettier - Code formatter

發布

Live server 從端口預覽非編譯靜態文件

# 文件注釋和函數注釋
KoroFileHeader 


=================================


# 寫CSS顏色代碼工具。使用:按#就出現了。比color pick好用一點
vs color picker
# sass轉換css、 min.css工具
easy sass


# 快速格式化代碼
Format Modified
# 正則大全
any-rule

參考閱讀

我的VS Code設置,高效編碼

問題

vscode配置插件時候不能正確跳轉json

C:\Users\XXXX\.vscode\extensions

從這里手動配置json

VS code快捷鍵
1、注釋:
  a) 單行注釋:[ctrl+k,ctrl+c] 或 ctrl+/
  b) 取消單行注釋:[ctrl+k,ctrl+u] (按下ctrl不放,再按k + u)
  c) 多行注釋:[alt+shift+A]
  d) 多行注釋:/**
2、移動行:alt+up/down
3、顯示/隱藏左側目錄欄 ctrl + b
4、復制當前行:shift + alt +up/down
5、刪除當前行:shift + ctrl + k
6、控制台終端顯示與隱藏:ctrl + ~
7、查找文件/安裝vs code 插件地址:ctrl + p
8、代碼格式化:shift + alt +f
9、新建一個窗口: ctrl + shift + n
10、行增加縮進: ctrl + [
11、行減少縮進: ctrl + ]
12、裁剪尾隨空格(去掉一行的末尾那些沒用的空格) : ctrl + shift + x
13、字體放大/縮小: ctrl + ( + 或 - )
14、拆分編輯器 :ctrl + 1/2/3
15、切換窗口:  ctrl + shift + left/right
16、關閉編輯器窗口:  ctrl + w
17、關閉所有窗口 : ctrl + k + w
18、切換全屏 :F11
19、自動換行:  alt + z
20、顯示git:   ctrl + shift + g
21、全局查找文件:ctrl + p
22、顯示相關插件的命令(如:git log):ctrl + shift + p
23、選中文字:shift + left / right / up / down
24、折疊代碼: ctrl + k + 0-9 (0是完全折疊)
25、展開代碼: ctrl + k + j (完全展開代碼)
26、刪除行 : ctrl + shift + k
27、快速切換主題:ctrl + k / ctrl + t
28、快速回到頂部 : ctrl + home
29、快速回到底部 : ctrl + end
30、格式化選定代碼 :ctrl + k / ctrl +f
31、選中代碼 : shift + 鼠標左鍵
32、多行同時添加內容(光標) :ctrl + alt + up/down
33、全局替換:ctrl + shift + h
34、當前文件替換:ctrl + h
35、打開最近打開的文件:ctrl + r
36、打開新的命令窗:ctrl + shift + c


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM