VScode基礎設置
安裝依賴包:
? One Monokai
? Aglia
? One Dark Pro
? Material Icon
漂亮的主題: Themes
Quokka
是一個調試工具插件,能夠根據你正在編寫的代碼提供實時反饋
CSS Peek
使用此插件,你可以追蹤至樣式表中 CSS 類和 ids 定義的地方。當你在 HTML 文件中右鍵單擊選擇器時,選擇“ Go to Definition 和 Peek definition ”選項,它便會給你發送樣式設置的 CSS 代碼。
HTML Boilerplate
通過使用 HTML 模版插件,你就擺脫了為 HTML 新文件重新編寫頭部和正文標簽的苦惱。你只需在空文件中輸入 html,並按 Tab 鍵,即可生成幹凈的文檔結構。
Color Info
這個便捷的插件,將為你提供你在 CSS 中使用顏色的相關信息。你只需在顏色上懸停光標,就可以預覽色塊中色彩模型的(HEX、 RGB、HSL 和 CMYK)相關信息了。
能夠將所寫的代碼運行在瀏覽器上.
eslint、Vetur
代碼格式化為eslint風格、HTML格式化代碼縮進
Vetur -->文件->首選項->設置,搜索vetur,按如下圖示將vetur插件的 vetur.format.defaultFormatter.html 的值修改成 js-beautify-html,
快捷鍵設置:
VScode對多行編輯有兩種模式。
第一種模式
Alt+Shift 豎列選擇
1
這種模式下只可以選擇豎列,不可以隨意插入光標。所以只限制於同一列且不間隔的情況下。
第二種模式
Shift+Ctrl 豎列選擇
Ctrl+光標點擊 選擇多個編輯位點
1
2
這種模式下不僅可以選擇豎列,同時還可以在多個地方插入光標。
兩種模式的切換
使用Shift+Ctrl+p快捷鍵調用查詢輸入欄,輸入“cursor”,列表中會出現“切換多行修改鍵”這個選項。選擇這個選項就可以在兩種模式下切換。
VScode基礎設置