Sublime Text3 React開發常用插件

Yangder 發布于2019-08-22 17:04 / 1860人閱讀

摘要：主要是針對語法的，用來快速編寫組件中的部分。配置該插件不需要額外配置，在打開或后綴的文件，直接選擇為對應的語法就可以了。是上格式化比較好用的插件之一，通過修改它的屬性可以使它支持。配置打開菜單，將下面代碼貼進去保存。

主要是針對jsx語法的，用來快速編寫組件中的html部分。

安裝

command+shift+p -> install package -> 對應的模塊名稱

Emmet

可以自動擴展react的className，這點不要太爽～
我們要做的，只是安裝好它之后稍微做下配置修改，就可以愉快的開擼了。

配置

打開菜單Preferences -> Package Settings -> Emmet -> Key Bindings - User

將下面代碼貼進去保存。更詳細的規則可以參考emmet-sublime文檔

[{
    "keys": ["tab"],
    "command": "expand_abbreviation_by_tab",

    // put comma-separated syntax selectors for which 
    // you want to expandEmmet abbreviations into "operand" key 
    // instead of SCOPE_SELECTOR.
    // Examples: source.js, text.html - source
    "context": [{
            "operand": "source.js",
            "operator": "equal",
            "match_all": true,
            "key": "selector"
        },

        // run only if there"s no selected text
        {
            "match_all": true,
            "key": "selection_empty"
        },

        // don"t work if there are active tabstops
        {
            "operator": "equal",
            "operand": false,
            "match_all": true,
            "key": "has_next_field"
        },

        // don"t work if completion popup is visible and you
        // want to insert completion with Tab. If you want to
        // expand Emmet with Tab even if popup is visible -- 
        // remove this section
        {
            "operand": false,
            "operator": "equal",
            "match_all": true,
            "key": "auto_complete_visible"
        }, {
            "match_all": true,
            "key": "is_abbreviation"
        }
    ]
}]

babel

支持ES6、React.js、jsx代碼語法高亮。

配置

該插件不需要額外配置，在打開.js或.jsx后綴的文件，直接選擇Babel為對應的語法就可以了。

jsFormat

jsformat是sublime上js格式化比較好用的插件之一，通過修改它的e4x屬性可以使它支持jsx。

配置

打開菜單Preferences -> Package Settings -> JsFormat -> Settings - User，將下面代碼貼進去保存。

{
  "e4x": true,
  // jsformat options
  "format_on_save": true,
}```

云服務器 GPU云服務器 sublime插件 react開發神器 docker react 開發 webrtc音視頻開發react

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/94825.html

Sublime Text3插件安裝及問題處理

摘要：軟件下載安裝官網可直接下載安裝，可免費使用解決安裝問題安裝在線安裝因為網絡原因可能失敗。常規插件安裝步驟以安裝漢化插件為例。使用Sublime Text3，沒有別的原因，總結起來就兩條：好看，快。當然它不像Webstorm那樣貼合前端開發，需要下載一些插件來輔助。剛開始學前端的時候，覺得下插件實在是太麻煩了，都想放棄了，但一來更受不了Webstorm啟動的龜速，二來舍不得Sublim...

bang590 2019-08-23 15:12 評論0 收藏0
個人常用的軟件-前端

摘要：今天重裝系統，切換到作業，記錄下個人常用的軟件，工具軟件版本管理工具圖形管理工具版本管理工具前端切圖必備需要動畫的時候用有道云筆記有模式，筆記寫代碼很方便調試接口抓包工具一款編譯的軟件，官網下載建議迅雷下載。今天重裝系統，切換到win10作業，記錄下個人常用的軟件， 1.工具軟件 git ：版本管理工具 tortoisegit ：git圖形管理工具 tortoisesvn ：...

vibiu 2019-08-01 18:17 評論0 收藏0
個人常用的軟件-前端

摘要：今天重裝系統，切換到作業，記錄下個人常用的軟件，工具軟件版本管理工具圖形管理工具版本管理工具前端切圖必備需要動畫的時候用有道云筆記有模式，筆記寫代碼很方便調試接口抓包工具一款編譯的軟件，官網下載建議迅雷下載。今天重裝系統，切換到win10作業，記錄下個人常用的軟件， 1.工具軟件 git ：版本管理工具 tortoisegit ：git圖形管理工具 tortoisesvn ：...

iKcamp 2019-08-29 14:06 評論0 收藏0
個人常用的軟件-前端

摘要：今天重裝系統，切換到作業，記錄下個人常用的軟件，工具軟件版本管理工具圖形管理工具版本管理工具前端切圖必備需要動畫的時候用有道云筆記有模式，筆記寫代碼很方便調試接口抓包工具一款編譯的軟件，官網下載建議迅雷下載。今天重裝系統，切換到win10作業，記錄下個人常用的軟件， 1.工具軟件 git ：版本管理工具 tortoisegit ：git圖形管理工具 tortoisesvn ：...

oysun 2019-08-21 18:23 評論0 收藏0