VSCode React JSX Tab鍵快速生成標籤對 配置方法

Intro

• emmet是前端 標籤代碼塊 形式代碼書寫的利器。
  而在VSCode中，默認有emmet的擴展。

• JSX是React語法中，用於快速組裝標籤代碼塊的一種寫法。
  但是一般情況下需要配置纔可以使用(不屬於HTML原生的標籤)。
  主要配置就是兩項：

"emmet.triggerExpansionOnTab": true,
"emmet.includeLanguages": {
   "javascript": "javascriptreact"
},

配置

在默認的配置文件中查找到了兩項配置：

// Enable Emmet abbreviations in languages that are not supported by default. 
// Add a mapping here between the language and emmet supported language.
//  E.g.: `{"vue-html": "html", "javascript": "javascriptreact"}`
"emmet.includeLanguages": {},

// When enabled, Emmet abbreviations are expanded when pressing TAB.
"emmet.triggerExpansionOnTab": false,

修改自己的配置文件即可(注意JSON文檔的層級、逗號等)。

我的配置文件：
從：

{    
    "remote.SSH.remotePlatform": {
        "wuyujin.com": "linux"
    }
}

修改爲：

{    
    "emmet.triggerExpansionOnTab": true,   
    "emmet.includeLanguages": {
        "javascript": "javascriptreact"
    },
    "remote.SSH.remotePlatform": {
        "wuyujin.com": "linux"
    }
}

重啓VSCode即可。

關於 VSCode 的默認配置和用戶自定義配置相關，見：
VSCode中的用戶自定義配置文件settings.json和默認配置defaultSettings.json