VSCode插件和首選項配置

一、常用的插件主要有以下：

vscode安裝日常用的插件，只需點擊擴展，在搜索框中搜索你所需要的插件即可

chinese 中文簡體安裝包

Vetur 語法高亮、智能感知

Vscode-icons 目錄樹圖標

Auto Close 自動添加HTML / XML關閉標簽

Beautify 格式化javascript，JSON，CSS，Sass，和HTM

css Peek 可以查看CSS ID和Class類與HTML文件中相應的CSS定義相對應

Html Css Support Html標簽智能提示

Html Snippets Html代碼片段

javaScript Es6 支持ES6語法

jQuery code 支持jQuery

One Dark Pro 代碼主題顏色（有好多可以自己去查）

Path Autocomplelet 引入文件路徑提示

 

二、VSCode首選項配置

1.進入vscode頁面，點擊設置打開開用戶設置或者點擊文件》首選項進入該頁面

2.如果進入為上述頁面，找不到setting.json文件，可通過ctrl+shift+p快捷鍵，在搜索欄輸入preferences:open settings(json)

3.進入用戶模式進行配置，初始化用戶設置為空，將下面內容拷貝進去（注意大括號{}）,紅色的區域主要是為了css提示設置（vscode安裝HTML CSS Support）

{
 "workbench.iconTheme": "vscode-icons",
    "editor.fontSize": 16,
    "editor.renderIndentGuides": false,
    "files.autoSave": "afterDelay",  <font color='red'>
    "editor.parameterHints": true,
    "editor.quickSuggestions": {
    "other": true,
    "comments": true,
    "strings": true
    },
    </font>
    "liveSassCompile.settings.formats":[
        {
            "format": "expanded",
            "extensionName": ".css",
            "savePath": "/css"
        },
        {
            "extensionName": ".min.css",
            "format": "compressed",
            "savePath": "/css"
        }
    ],
    "liveSassCompile.settings.excludeList": [
       "**/node_modules/**",
       ".vscode/**"
    ],
    "liveSassCompile.settings.generateMap": true,
    "easysass.formats": [
        {
            "format": "expanded",
            "extension": ".css"
        },
        {
            "format": "compressed",
            "extension": ".min.css"
        }
    ],
    "easysass.targetDir": "./css/",
    "background.customImages": [
        "file:///D://222.png"
    ],
    "background.useDefault": false,
    "background.style": {
        "content": "''",
        "pointer-events": "none",
        "position": "absolute",
        "z-index": "99999",
        "width": "102%",
        "height": "100%",
        "background-position": "0%",
        "background-repeat": "no-repeat",
        "opacity": 0.3
    },
    "cssrem.rootFontSize": 1,
    "cssrem.autoRemovePrefixZero": false,
    "cssrem.fixedDigits": 3,
    "beautify.language": {
        "js": {
            "type": [
                "javascript",
                "json"
            ],
            "filename": [
                ".jshintrc",
                ".jsbeautify"
            ]
        },
        "css": [
            "css",
            "scss"
        ],
        "html": [
            "htm",
            "vue",
            "html"
        ]
    }
    }