vscode使用editorconfig插件以及.editorconfig配置文件說明詳解
簡(jiǎn)介
EditorConfig和Prettier一樣,都是用來配置格式化你的代碼的,這個(gè)格式化代碼,要和你lint配置相符!否則會(huì)出現(xiàn)你格式化代碼以后,卻不能通過你的代碼校驗(yàn)工具的檢驗(yàn)
EditorConfig 文件中的設(shè)置用于在基本代碼庫(kù)中維持一致的編碼風(fēng)格和設(shè)置,例如縮進(jìn)樣式、選項(xiàng)卡寬度、行尾字符以及編碼等,而無需考慮使用的編輯器vscode使用editorconfig插件以及.editorconfig配置文件說明詳解
或 IDE
editorConfig不是什么軟件,而是一個(gè)名稱為.editorconfig的自定義文件。該文件用來定義項(xiàng)目的編碼規(guī)范,編輯器的行為會(huì)與.editorconfig 文件中定義的一致,并且其優(yōu)先級(jí)比編輯器自身的設(shè)置要高,這在多人合作開發(fā)項(xiàng)目時(shí)十分有用而且必要
有些編輯器默認(rèn)支持editorConfig,如webstorm;而有些編輯器則需要安裝editorConfig插件,如ATOM、Sublime、VS Code等
當(dāng)打開一個(gè)文件時(shí),EditorConfig插件會(huì)在打開文件的目錄和其每一級(jí)父目錄查找.editorconfig文件,直到有一個(gè)配置文件root=true
EditorConfig的配置文件是從上往下讀取的并且最近的EditorConfig配置文件會(huì)被最先讀取. 匹配EditorConfig配置文件中的配置項(xiàng)會(huì)按照讀取順序被應(yīng)用, 所以最近的配置文件中的配置項(xiàng)擁有優(yōu)先權(quán)
如果.editorconfig文件沒有進(jìn)行某些配置,則使用編輯器默認(rèn)的設(shè)置
配置.editorconfig
在當(dāng)前項(xiàng)目根目錄下添加.editorconfig文件
editorconfig文件是定義一些格式化規(guī)則(此規(guī)則并不會(huì)被vscode直接解析)
官網(wǎng)的一個(gè)配置
# EditorConfig is awesome: https://EditorConfig.org # top-most EditorConfig file 表示是最頂層的配置文件,發(fā)現(xiàn)設(shè)為true時(shí),才會(huì)停止查找.editorconfig文件 root = true # Unix-style newlines with a newline ending every file 對(duì)于所有的文件 始終在文件末尾插入一個(gè)新行 [*] end_of_line = lf insert_final_newline = true # Matches multiple files with brace expansion notation # Set default charset 對(duì)于所有的js,py文件,設(shè)置文件字符集為utf-8 [*.{js,py}] charset = utf-8 # 4 space indentation 控制py文件類型的縮進(jìn)大小 [*.py] indent_style = space indent_size = 4 # Tab indentation (no size specified) 設(shè)置某中文件的縮進(jìn)風(fēng)格為tab Makefile未指明 [Makefile] indent_style = tab # Indentation override for all JS under lib directory 設(shè)置在lib目錄下所有JS的縮進(jìn)為 [lib/**.js] indent_style = space indent_size = 2 # Matches the exact files either package.json or .travis.yml 設(shè)置確切文件 package.json/.travis/.yml的縮進(jìn)類型 [{package.json,.travis.yml}] indent_style = space indent_size = 2
語(yǔ)法
editorConfig配置文件需要是UTF-8字符集編碼的, 以回車換行或換行作為一行的分隔符
斜線(/)被用作為一個(gè)路徑分隔符,井號(hào)(#)或分號(hào)(;)被用作于注釋. 注釋需要與注釋符號(hào)寫在同一行
通配符
* 匹配除/之外的任意字符串 ** 匹配任意字符串 ? 匹配任意單個(gè)字符 [name] 匹配name中的任意一個(gè)單一字符 [!name] 匹配不存在name中的任意一個(gè)單一字符 {s1,s2,s3} 匹配給定的字符串中的任意一個(gè)(用逗號(hào)分隔) {num1..num2} 匹配num1到num2之間的任意一個(gè)整數(shù), 這里的num1和num2可以為正整數(shù)也可以為負(fù)整數(shù)
屬性
所有的屬性和值都是忽略大小寫的. 解析時(shí)它們都是小寫的
indent_style 設(shè)置縮進(jìn)風(fēng)格(tab是硬縮進(jìn),space為軟縮進(jìn)) indent_size 用一個(gè)整數(shù)定義的列數(shù)來設(shè)置縮進(jìn)的寬度,如果indent_style為tab,則此屬性默認(rèn)為tab_width tab_width 用一個(gè)整數(shù)來設(shè)置tab縮進(jìn)的列數(shù)。默認(rèn)是indent_size end_of_line 設(shè)置換行符,值為lf、cr和crlf charset 設(shè)置編碼,值為latin1、utf-8、utf-8-bom、utf-16be和utf-16le,不建議使用utf-8-bom trim_trailing_whitespace 設(shè)為true表示會(huì)去除換行行首的任意空白字符。 insert_final_newline 設(shè)為true表示使文件以一個(gè)空白行結(jié)尾 root 表示是最頂層的配置文件,發(fā)現(xiàn)設(shè)為true時(shí),才會(huì)停止查找.editorconfig文件
控制指定文件類型的縮進(jìn)大小
這里可以設(shè)置,如下:
[{*.json,*.yml}] indent_style = space indent_size = 2
對(duì)于.json .yml 文件,使用空格替代tab,并且一個(gè)tab會(huì)被替換為2個(gè)空格。
文件末尾新行
始終在文件末尾插入一個(gè)新行
[*] end_of_line = lf insert_final_newline = true
對(duì)于所有的文件
- 每一行的尾部自動(dòng)調(diào)整為 Lf
- 文件的末尾是一個(gè)空行
實(shí)例
# editorconfig.org root = true [*] charset = utf-8 indent_size = 4 indent_style = space insert_final_newline = true trim_trailing_whitespace = true [*.md] trim_trailing_whitespace = false
安裝 EditorConfig擴(kuò)展
在vscode里面安裝EditorConfig
EditorConfig擴(kuò)展的作用是讀取第一步創(chuàng)建的editorconfig文件中定義的規(guī)則,并覆蓋user/workspace settings中的對(duì)應(yīng)配置(從這我們也可以看出vscode本身其實(shí)是并不直接支持editorconfig的)
全局安裝或局部安裝
editorconfig依賴包(npm install -g editorconfig | npm install -D editorconfig)
安裝editorconfig依賴包主要是因?yàn)镋ditorConfig依賴于editorconfig包,不安裝的可能會(huì)導(dǎo)致EditorConfig無法正常解析我們?cè)诘谝徊蕉x的editorconfig文件
使用
打開需要格式化的文件并手動(dòng)格式化代碼(shift+alt+f)
使用建議
配合代碼檢查工具使用,比如說:ESLint或TSLint,統(tǒng)一代碼風(fēng)格。
我的用于vue項(xiàng)目的配置文件
配合ESLint + Prettier
#表示是最頂層的配置文件,發(fā)現(xiàn)設(shè)為true時(shí),才會(huì)停止查找.editorconfig文件 root = true # Unix-style newlines with a newline ending every file 對(duì)于所有的文件 始終在文件末尾插入一個(gè)新行 [*] end_of_line = crlf insert_final_newline = true # 對(duì)于所有的js文件,設(shè)置文件字符集為utf-8 [*.js] charset = utf-8 # 設(shè)置所有JS,vue的縮進(jìn)為 [*.{js,vue}] indent_style = tab
到此這篇關(guān)于vscode使用editorconfig插件以及.editorconfig配置文件說明詳解的文章就介紹到這了,更多相關(guān)vscode editorconfig配置內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
Apifox?Echo學(xué)習(xí)curl?httpie?命令使用詳解
這篇文章主要為大家介紹了通過Apifox?Echo學(xué)習(xí)curl?httpie?命令使用,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-09-09IDEA升級(jí)后Git拉取和推送的標(biāo)簽消失的解決方法
本文主要介紹了IDEA升級(jí)后Git拉取和推送的標(biāo)簽消失的解決方法,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-06-06Unity項(xiàng)目?jī)?yōu)化相關(guān)技巧
隨著項(xiàng)目越做越大,工作年限的增加,對(duì)項(xiàng)目的優(yōu)化方面要求也越來越高(面試必備),本文簡(jiǎn)單羅列一些unity項(xiàng)目中的優(yōu)化技巧,有需要的朋友可以參考下2021-09-09