VScode編輯器最好用的幾款必備插件和設置

vscode 擴展↓

Auto Close Tag

自動補全代碼塊

background

背景圖 (可以改變背景圖 , 沒有實用價值)

Beautify

美化代碼 (將一行代碼編程嵌套)

Color Info

顯示css顏色塊 (可以自定義顏色)

HTML Boilerplate

標準HTML樣板代碼

minify

用F1 縮小爲單個文件 , 保存爲minify

One Monokai Theme

字體美化彩色 (自用比較舒服的代碼美化主題)

Path Intellisense

路徑智能感知(自動查找填充文件路徑名稱)

Power Mode

打字動畫 (只有美化功能)

Prettier - Code formatter

更漂亮的代碼格式化程序

Quokka.js

代碼擴展

React Native Extension Pack

React Native項目提供了一個開發環境

Vetur

vue 語法加亮 片段 錯誤檢查 格式化 調試

Vue 2 Snippets

vue 代碼提示

View In Browser

設置默認瀏覽器打開方式

"view-in-browser.customBrowser": "chrome"

Open In Default Browser

可以選擇瀏覽器打開方式

設置中配置的文件↓

{
    "git.ignoreMissingGitWarning": true,
    "workbench.colorTheme": "One Monokai",
    "markdown.preview.fontSize": 22,
    "editor.fontSize": 20,
    "open-in-browser.default": "chrome",
    "files.autoSave": "onFocusChange",
    "editor.formatOnPaste": true,
    "window.zoomLevel": -1,
    "background.enabled": true,
    "background.useDefault": true,
     //是否使用默認圖片
    "background.style": {
    "content": "''",
    "pointer-events": "none",
    "position": "absolute",
    "z-index": "99999",
    "width": "100%",
    "height": "100%",
    "background-position": "100% 100%",
    "background-repeat": "no-repeat",
    "opacity": 0.3
    },
    "powermode.enabled": true,
    "powermode.enableShake": false,
    "update.enableWindowsBackgroundUpdates": true,
    "emmet.triggerExpansionOnTab": true,
    "emmet.includeLanguages": {
        "vue-html":"html",
        "javascript":"javascriptreact",
        "wxml":"html"
    }
}