如何在Sublime Text 3上設置HTML自動縮進格式？

Question

當我在Sublime Text 3上編寫HTML代碼時，有一個問題。我只想設置HTML的自動縮進格式。例如，當我像編碼一樣寫p標籤時，縮進就像那樣工作。

<p> 
Hello world! 
</p> 

但我想寫下代碼而不是上面。

<p> 
    Hello world! 
</p> 

而且不只是p標籤也UL，OL等

如何設置HTML的自動縮進格式的文本崇高3？

Answer 1

一個選項是鍵入[command] + [shift] + [p]（或等價物），然後鍵入'indentation'。最重要的結果應該是'Indendtation：Reindent Lines'。按[enter]鍵，它將格式化文件。

另一種選擇是安裝Emmet插件（http://emmet.io/），它不僅可以提供更好的格式，還可以提供許多其他令人難以置信的功能。爲了讓您正在尋找使用文本崇高3埃米特插件輸出只需要如下：

p [tab][enter] Hello world! 

當你按p [標籤]埃米特它擴展爲：

<p></p> 

按[輸入]然後進一步將其擴展爲：

<p> 

</p> 

隨着光標縮進和標籤之間的界限。 這意味着在輸入文本的結果：

<p> 
    Hello, world! 
</p> 

Answer 2

這是竊聽我太多，因爲這是在崇高的文本2的標準功能，但不知何故，自動縮進不再崇高的文本3工作了HTML文件。

我的解決方案是從Sublime Text 2（在％AppData％/ Roaming/Sublime Text 2/Packages/HTML下找到）中找到Miscellaneous.tmPreferences文件，並將這些設置複製到ST3的同一文件中。

現在包處理對於ST3來說變得更加困難了，但幸運的是，您可以將文件添加到％AppData％/ Roaming/Sublime Text 3/Packages文件夾，並覆蓋安裝目錄中的默認設置。只需將此文件另存爲「％AppData％/ Roaming/Sublime Text 3/Packages/HTML/Miscellaneous.tmPreferences」，然後自動縮進就像在ST2中一樣工作。

<?xml version="1.0" encoding="UTF-8"?> 
<!DOCTYPE plist PUBLIC "-//Apple Computer//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd"> 
<plist version="1.0"> 
<dict> 
    <key>name</key> 
    <string>Miscellaneous</string> 
    <key>scope</key> 
    <string>text.html</string> 
    <key>settings</key> 
    <dict> 
     <key>decreaseIndentPattern</key> 
      <string>(?x) 
      ^\s* 
      (&lt;/(?!html) 
       [A-Za-z0-9]+\b[^&gt;]*&gt; 
      |--&gt; 
      |&lt;\?(php)?\s+(else(if)?|end(if|for(each)?|while)) 
      |\} 
      )</string> 
     <key>batchDecreaseIndentPattern</key> 
      <string>(?x) 
      ^\s* 
      (&lt;/(?!html) 
       [A-Za-z0-9]+\b[^&gt;]*&gt; 
      |--&gt; 
      |&lt;\?(php)?\s+(else(if)?|end(if|for(each)?|while)) 
      |\} 
      )</string> 
     <key>increaseIndentPattern</key> 
      <string>(?x) 
      ^\s* 
      &lt;(?!\?|area|base|br|col|frame|hr|html|img|input|link|meta|param|[^&gt;]*/&gt;) 
       ([A-Za-z0-9]+)(?=\s|&gt;)\b[^&gt;]*&gt;(?!.*&lt;/\1&gt;) 
      |&lt;!--(?!.*--&gt;) 
      |&lt;\?php.+?\b(if|else(?:if)?|for(?:each)?|while)\b.*:(?!.*end\1) 
      |\{[^}"']*$ 
      </string> 
     <key>batchIncreaseIndentPattern</key> 
      <string>(?x) 
      ^\s* 
      &lt;(?!\?|area|base|br|col|frame|hr|html|img|input|link|meta|param|[^&gt;]*/&gt;) 
       ([A-Za-z0-9]+)(?=\s|&gt;)\b[^&gt;]*&gt;(?!.*&lt;/\1&gt;) 
      |&lt;!--(?!.*--&gt;) 
      |&lt;\?php.+?\b(if|else(?:if)?|for(?:each)?|while)\b.*:(?!.*end\1) 
      |\{[^}"']*$ 
      </string> 
     <key>bracketIndentNextLinePattern</key> 
     <string>&lt;!DOCTYPE(?!.*&gt;)</string> 
    </dict> 
</dict> 
</plist> 

Answer 3

創建鍵綁定

要在崇高的文本3自動縮進一鍵綁定嘗試將

首選項>鍵綁定 - 用戶

並添加方括號之間的代碼

{"keys": ["alt+shift+f"], "command": "reindent", "args": {"single_line": false}} 

it sets shift + alt + f將成爲您的整頁自動縮進。

來源here

注：如果不能正常工作，那麼你應該將縮進轉換爲標籤。此外，您的代碼中的註釋可能會將您的代碼壓縮到錯誤的縮進級別，可能必須手動移動。

Answer 4

這是對上述答案的修改，但應該更加完整。

要清楚，這是爲當在Sublime Text中打開HTML文件時，重新引入先前的自動縮進功能。所以當你完成一個標籤時，它會自動縮進下一個元素。

Windows用戶

轉到C:\Program Files\Sublime Text 3\Packages提取​​，就好像它是一個zip文件的目錄。

打開Miscellaneous.tmPreferences這個內容複製到文件

<?xml version="1.0" encoding="UTF-8"?> 
<!DOCTYPE plist PUBLIC "-//Apple Computer//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd"> 
<plist version="1.0"> 
<dict> 
    <key>name</key> 
    <string>Miscellaneous</string> 
    <key>scope</key> 
    <string>text.html</string> 
    <key>settings</key> 
    <dict> 
     <key>decreaseIndentPattern</key> 
      <string>(?x) 
      ^\s* 
      (&lt;/(?!html) 
       [A-Za-z0-9]+\b[^&gt;]*&gt; 
      |--&gt; 
      |&lt;\?(php)?\s+(else(if)?|end(if|for(each)?|while)) 
      |\} 
      )</string> 
     <key>batchDecreaseIndentPattern</key> 
      <string>(?x) 
      ^\s* 
      (&lt;/(?!html) 
       [A-Za-z0-9]+\b[^&gt;]*&gt; 
      |--&gt; 
      |&lt;\?(php)?\s+(else(if)?|end(if|for(each)?|while)) 
      |\} 
      )</string> 
     <key>increaseIndentPattern</key> 
      <string>(?x) 
      ^\s* 
      &lt;(?!\?|area|base|br|col|frame|hr|html|img|input|link|meta|param|[^&gt;]*/&gt;) 
       ([A-Za-z0-9]+)(?=\s|&gt;)\b[^&gt;]*&gt;(?!.*&lt;/\1&gt;) 
      |&lt;!--(?!.*--&gt;) 
      |&lt;\?php.+?\b(if|else(?:if)?|for(?:each)?|while)\b.*:(?!.*end\1) 
      |\{[^}"']*$ 
      </string> 
     <key>batchIncreaseIndentPattern</key> 
      <string>(?x) 
      ^\s* 
      &lt;(?!\?|area|base|br|col|frame|hr|html|img|input|link|meta|param|[^&gt;]*/&gt;) 
       ([A-Za-z0-9]+)(?=\s|&gt;)\b[^&gt;]*&gt;(?!.*&lt;/\1&gt;) 
      |&lt;!--(?!.*--&gt;) 
      |&lt;\?php.+?\b(if|else(?:if)?|for(?:each)?|while)\b.*:(?!.*end\1) 
      |\{[^}"']*$ 
      </string> 
     <key>bracketIndentNextLinePattern</key> 
     <string>&lt;!DOCTYPE(?!.*&gt;)</string> 
    </dict> 
</dict> 
</plist> 

然後重新壓縮該文件爲​​並替換現有​​與您剛剛創建的。

關閉並打開崇高文本3，就完成了！