webstorm 配置項文檔 + 使用文檔 (二)

webstorm 配置項文檔 + 使用文檔

時間: 2020-10-13 webstorm2020.2.3 版本

經過 ctrl+F 搜索你想了解的 webstorm 配置javascript

有些效果按 Apply 就能夠看出效果, 而有些效果則須要按 OK 才行。html

Save Files 保存文件

  • Strip trailing spaces on Save for 刪除尾隨空格邏輯vue

    • Modified Lines 只在修改行刪除
    • All 全部行
    • None 禁用
  • Delete trailing spaces on caret line 刪除光標所在行的尾隨空格
  • Ensure an empty line at the end of a file on Save 保存時確保文件末尾有空行

Code Editing 代碼編輯

Highlight on Caret Movement 光標移動時的高亮邏輯

  • Matched brace 大括號匹配
  • Current scope 當前範圍
    image
  • Usages of element at caret 當前光標所在的元素
    image

Refactorings 重構

  • Specify refactoring options 指定重構選項java

    • in the editor 在編輯器中
      image
    • In the modal dialogs 在模態對話框中
      image

TODO: 後續兩個選項暫時不知道有何做用web

Error Highlighting 錯誤高亮

  • Error stripe mark min height 錯誤條紋標記最小高度
  • Autoreparse delay 自動解析延遲
  • The " Next Error'action goes through 執行「Next Error」操做

Quick Documentation 快速文檔

  • Show quick documentation on mouse move 鼠標移動時顯示快速文檔

Editor Tooltips 編輯器工具提示

  • Tooltip delay 工具提示延遲

Font 字體

  • Font 字體正則表達式

    • Show only monospaced fonts 僅僅顯示等寬字體
  • Size 大小
  • Line spacing 行距
  • Fallback font 對於主字體不支持的符號時使用的字體
  • Enable font ligatures 啓用字體連字

Color Scheme 配色方案

此節點下的全部節點均是配置顏色方案express

Code Style 代碼樣式

使用html,javascript舉例,其餘語言節點同理

General 常規

  • Line separator 行分隔符macos

    • System-dependent 依賴於系統
    • Unix and macos ( \ n )
    • Windows ( \ r \ n )
    • Classic macos ( \ r )
  • Hard wrap 強行換行點api

    • Wrap on typing 是否自動換行
  • Visual guides 換行點視覺參考線
  • Detect and use existing file indents for editing 檢測並使用現有文件縮進進行編輯

Formatter Control 格式化控制

  • Enable formatter markers in comments 是否在啓用在註釋中控制是否格式化代碼dom

    • Formatter off 格式化關閉的註釋
    • Formatter on 格式化開啓的註釋
    • Enable regular expressions in formatter markers 對於上面填的註釋markers是否能夠是正則表達式

如何理解此選項?

其實就是用一塊特定的註釋包圍的代碼不進行格式化, 例子:

image

上面的語句我不想被格式化掉,就能夠這樣作:

image

  • Do not format , optimize imports , arrange code 不進行格式化,分析import代碼的域

Scope的概念見本文檔的Scope域部分

Inspections 檢查

選項過多,並且有些建議因人而異,有須要的話能夠另開篇文章。

File and Code Templates 文件和代碼模板

新建文件時的代碼模板。

使用的是Apache Velocity 模板引擎。

TODO: 閱讀idea源碼

File Encodings文件編碼

Live Templates 實時模板/用戶代碼片斷

用過IDE,編輯器的都明白,用戶代碼片斷是最經常使用的功能了。

建立代碼片斷例子

  • 點擊「+」號, 新建片斷
  • 建立如圖所示的片斷
    image
  • 使用: 在vue template中輸入「efi」便可生成

使用模板變量(進階)

上圖使用的變量若是沒有定義內容的話,兩個$中的變量名不管命名成什麼都同樣, ide光標老是會從左往右,從上至下跳轉

(能夠試試隨意命令兩個$中的內容)

點擊「Edit variable」開啓編輯變量,使變量更有意義! 如下是表達式所表明的意義:

  • blockcommentend() 塊註釋結束
    表明註釋結束的部分, 根據當前語句位置,能夠是"-->" "*/"等!!
  • blockcommentstart() 塊註釋開始
    表明註釋開始的部分, 根據當前語句位置,能夠是"/\*" "<!--"等!!
  • camelcase(String) 小駝峯命名
    單獨用沒什麼用,可是配合其餘變量便能發揮出它的威力了,例子以下:

    • 當前文件名:dom-to-image.min.js
    • 建立片斷名爲test, 內容爲$1$
      image
    • 編輯變量 ( Expression中的內容是可編輯的! )
      image
    • 在文件中輸入test

      內容被替換爲

      domToImageMinJs
  • capitalize(String) 首字母大寫

    用法同上,如下用法皆類似

  • capitalizeAndUnderscore(String)

將字符串的全部字母大寫,並在各部分之間插入下劃線

  • clipboard() 獲取剪切板的字符
  • commentEnd() 註釋結束

    注意和blockcommentend()區分, 一個是行註釋一個是塊註釋

  • commentStart() 註釋開始
  • complete() 在變量的位置調用代碼完成。

complete的用法還在理解測試中。
一個個測試來的~, 以爲有用能夠點個贊。


難受,沒人看,算了

相關文章
相關標籤/搜索