如何在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，就完成了！