WebStorm設置字體和顏色


新建Scheme + 修改字體

ctrl+alt+s打開Settings界面,Editor > Colors&Fonts > Font。

Default scheme是亮色調,但我想定制一套暗背景的環境,所以在右側Scheme name下拉框中選擇Monokai,以此作為修改的基礎,然后點擊Save as,給自己新建的Scheme起個名字吧,如下圖:

font

這里面可以設置字體(我一般選擇Consolas),字體大小,行間距。

 

自定義語法高亮

用ctrl+alt+s打開Settings界面,Editor > Colors&Fonts。

lang

不同語言有各自的語法高亮規則,但有一部分是通用的(General),我們首先來設置General,然后再根據需要設置不同語言的語法高亮。

General的設置

普通文本:default text

折疊文本: Folded text

光標: Caret

光標所在行: Caret row

行號: Line number

TODO: TODO default

光標下變量高亮:Search result

搜索結果:Text search result

匹配的括號:Matched brace

不匹配的括號:Unmatched brace

未使用的符號:Unused symbol

左邊空隙(行號,斷點):Gutter background

選中的文本背景色:Selection background

選中的文本前景色:Selection foreground

 

區分語言的設置

舉例來說,如果要更改Javascript的語法高亮,就在上圖中選擇Javascript,然后再進行詳細設置。具體設置項就不贅述了。

 

顯示行號 + 自動換行

如果用Vim編程,行號是非常必要的輔助。WebStorm默認是不顯示行號的,沒關系,顯示行號非常的容易。

只要在代碼左側的gutter區域點右鍵,就會出現下圖的菜單:勾選上Show Line Numbers即可。

line number

另外,勾選上圖中的Use Soft Wraps就啟用了WebStorm的自動換行的功能,即過長的代碼行不會超出屏幕,不會出現橫向的滾動條。

值得一提的是,標准的Vim,jk是移到上一行下一行,如果代碼自動換行了,被分割成的兩行雖然看起來是兩行,但其實是一個邏輯行,這時候用jk是上移下移一個邏輯行。這種情況下,如果要從同一邏輯行的“第一行”移動到“第二行”,需要按gj,即先按g再按方向。雖然Vim提供了這個方法,但還是經常按錯。

好消息是,啟用了Use Soft Wraps的WebStorm不需要這樣,直接按j就可以從同一邏輯行的“第一行”移動到“第二行”。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM