>[success] # EditorConfig -- 專注于統一編輯器編碼風格配置 ~~~ 1.代碼編譯器本身維護一份配置比如「設定縮進使用 Tab 還是 Space」，「一個 Tab 占用多少列」， 「是否在文件末尾顯示空行」等等 2.代碼編輯器的配置信息獨立維護不對外共享。使用不同編輯器打開同一份文件，如果編輯器配置不統一， 顯示效果和輸入內容很有可能不一致，單個編輯器獨立操作只是存在隱患，在多編輯器或跨編輯器的情況下， 隱患就容易升級為問題，最終導致代碼處于混雜狀態 ~~~ >[info] ## EditorConfig 如何工作 ~~~ 1.在項目中共享 .editorconfig 文件，該文件可被 EditorConfig 解析，由 EditorConfig 告知編輯器覆蓋默認配置。 2.一些編輯器內置支持 EditorConfig，比如 WebStorm、Github；而一些編輯器需要安裝 EditorConfig 插件， 比如 VSCode、Sublime。對主流代碼編輯器的高覆蓋支撐 EditorConfig 成為被廣泛應用的解決方案 ~~~ ~~~ indent_style 設置縮進為 tab 或 space tab_width 設置 tab 所占列數。默認是indent_size indent_size 設置縮進所占列數，如果 indent_style 為 tab，則以 tab_width 值作為縮進寬度 end_of_line 設置換行符，值為lf、cr和crlf charset 設置編碼，值為latin1、utf-8、utf-8-bom、utf-16be和utf-16le，不建議使用utf-8-bom trim_trailing_whitespace 設為 true 表示會去除行尾的空白字符 insert_final_newline 設為 true 表示使文件以一個空白行結尾 root 　　　表示是最頂層的配置文件，設為 true 時，停止向上查找 ~~~ [editorconfig](https://editorconfig.org/) >[danger] ##### 關于配置 -- .editorconfig 文件 ~~~ python # https://editorconfig.org # 已經是頂層配置文件，不必繼續向上搜索 root = true [*] # 編碼字符集 charset = utf-8 # 縮進風格是空格 indent_style = space # 一個縮進占用兩個空格，因沒有設置tab_with，一個Tab占用2列 indent_size = 2 # 換行符 lf end_of_line = lf # 文件以一個空白行結尾 insert_final_newline = true # 去除行首的任意空白字符 trim_trailing_whitespace = true [*.md] # 表示僅 md 文件適用以下規則 insert_final_newline = false trim_trailing_whitespace = false ~~~ >[danger] ##### 解決問題 ~~~ 1.EditorConfig 解決了編輯器配置層面的編碼風格一致性問題。 ~~~ >[danger] ##### Prettier 還需要 EditorConfig ~~~ 1.EditorConfig 作用于預覽和輸入階段，Prettier 在保存和提交階段重新組織代碼， Prettier 會成為代碼形態的最終決定者。 2. EditorConfig 覆蓋所有類型的文件，可以采用 EditorConfig 管理相交屬性，其他屬性則由 Prettier 控制。 ~~~ >[info] ## 參考 [前端代碼規范化：EditorConfig + Prettier + ESLint ](https://zhuanlan.zhihu.com/p/366141969)