Comment configurer le format HTML Auto Indent sur Sublime Text 3?
j'ai une question pendant que j'écris du code HTML sur Sublime Text 3. Je veux juste définir le format auto indent de HTML. Par exemple, quand j'écris une balise p comme sous code, l'indentation fonctionne comme ça.
<p>
Hello world!
</p>
Mais je veux écrire comme sous le code au lieu de ci-dessus.
<p>
Hello world!
</p>
Comment puis-je définir le format auto indent de HTML sur Sublime Text 3?
4 réponses
Une option est de type [commande] + [maj] + [p] (ou l'équivalent) puis tapez "indentation'. Le résultat supérieur doit être 'Indendtation: Reindent Lines'. Appuyez sur [enter] et il formatera le document.
une autre option est d'installer le plugin Emmet (http://emmet.io/), qui fournira non seulement un meilleur formatage, mais aussi une myriade d'autres fonctionnalités incroyables. Pour obtenir la sortie que vous recherchez en utilisant Sublime texte 3 avec le plugin Emmet nécessite juste le code suivant:
p [tab][enter] Hello world!
quand vous tapez P [tab] Emmet l'étend en:
<p></p>
appuyez sur la touche [enter], puis de plus amples augmente à:
<p>
</p>
avec le curseur en retrait et sur la ligne entre les balises. Ce qui signifie que taper du texte entraîne:
<p>
Hello, world!
</p>
Créer un Raccourci clavier
à l'indentation automatique sur le texte Sublime 3 avec une touche bind essayer d'aller à
Préférences > raccourcis clavier - utilisateurs
Et en ajoutant ce code entre crochets
{"keys": ["alt+shift+f"], "command": "reindent", "args": {"single_line": false}}
fixe maj+ alt+ f à votre pleine page de retrait automatique.
Source ici
Remarque: si cela ne fonctionne pas correctement, alors vous vous devriez convertir votre indentation en onglets. Aussi des commentaires dans votre code pouvez pousser votre code au mauvais niveau d'indentation et peut être déplacé manuellement.
cela me gênait aussi, puisque c'était une fonctionnalité standard dans Sublime Text 2, mais d'une certaine façon l'indentation automatique ne fonctionnait plus dans Sublime Text 3 pour les fichiers HTML.
ma solution était de trouver la Divers.tmPreferences fichier de Sublime Text 2 (trouvé sous %AppData% / Roaming / Sublime Text 2 / Packages / HTML) et copier ces paramètres dans le même fichier pour ST3.
maintenant la gestion des paquets a été rendue plus difficile pour ST3, mais heureusement vous pouvez juste ajouter les fichiers à votre dossier%AppData % /Roaming/Sublime Text 3/Packages et ils écrasent les paramètres par défaut dans le répertoire d'installation. Il suffit de sauvegarder ce fichier comme "%AppData%/Roaming/Sublime Text 3/Packages/HTML/Miscellaneous.tmPreferences " et auto indent fonctionne à nouveau comme il l'a fait dans 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*
(</(?!html)
[A-Za-z0-9]+\b[^>]*>
|-->
|<\?(php)?\s+(else(if)?|end(if|for(each)?|while))
|\}
)</string>
<key>batchDecreaseIndentPattern</key>
<string>(?x)
^\s*
(</(?!html)
[A-Za-z0-9]+\b[^>]*>
|-->
|<\?(php)?\s+(else(if)?|end(if|for(each)?|while))
|\}
)</string>
<key>increaseIndentPattern</key>
<string>(?x)
^\s*
<(?!\?|area|base|br|col|frame|hr|html|img|input|link|meta|param|[^>]*/>)
([A-Za-z0-9]+)(?=\s|>)\b[^>]*>(?!.*</>)
|<!--(?!.*-->)
|<\?php.+?\b(if|else(?:if)?|for(?:each)?|while)\b.*:(?!.*end)
|\{[^}"']*$
</string>
<key>batchIncreaseIndentPattern</key>
<string>(?x)
^\s*
<(?!\?|area|base|br|col|frame|hr|html|img|input|link|meta|param|[^>]*/>)
([A-Za-z0-9]+)(?=\s|>)\b[^>]*>(?!.*</>)
|<!--(?!.*-->)
|<\?php.+?\b(if|else(?:if)?|for(?:each)?|while)\b.*:(?!.*end)
|\{[^}"']*$
</string>
<key>bracketIndentNextLinePattern</key>
<string><!DOCTYPE(?!.*>)</string>
</dict>
</dict>
</plist>
ceci est une adaptation de la réponse ci-dessus, mais devrait être plus complète.
Pour être clair, c'est-à -ré-introduire précédente auto-indentation lorsque les fichiers HTML sont ouverts en texte Sublime. Ainsi, lorsque vous terminez une balise, elle s'indente automatiquement pour l'élément suivant.
Utilisateurs De Windows
C:\Program Files\Sublime Text 3\Packages extrait HTML.sublime-package comme si c'est un fichier zip dans un répertoire.
Ouvrir Miscellaneous.tmPreferences et copiez ce contenu dans le le fichier
<?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*
(</(?!html)
[A-Za-z0-9]+\b[^>]*>
|-->
|<\?(php)?\s+(else(if)?|end(if|for(each)?|while))
|\}
)</string>
<key>batchDecreaseIndentPattern</key>
<string>(?x)
^\s*
(</(?!html)
[A-Za-z0-9]+\b[^>]*>
|-->
|<\?(php)?\s+(else(if)?|end(if|for(each)?|while))
|\}
)</string>
<key>increaseIndentPattern</key>
<string>(?x)
^\s*
<(?!\?|area|base|br|col|frame|hr|html|img|input|link|meta|param|[^>]*/>)
([A-Za-z0-9]+)(?=\s|>)\b[^>]*>(?!.*</>)
|<!--(?!.*-->)
|<\?php.+?\b(if|else(?:if)?|for(?:each)?|while)\b.*:(?!.*end)
|\{[^}"']*$
</string>
<key>batchIncreaseIndentPattern</key>
<string>(?x)
^\s*
<(?!\?|area|base|br|col|frame|hr|html|img|input|link|meta|param|[^>]*/>)
([A-Za-z0-9]+)(?=\s|>)\b[^>]*>(?!.*</>)
|<!--(?!.*-->)
|<\?php.+?\b(if|else(?:if)?|for(?:each)?|while)\b.*:(?!.*end)
|\{[^}"']*$
</string>
<key>bracketIndentNextLinePattern</key>
<string><!DOCTYPE(?!.*>)</string>
</dict>
</dict>
</plist>
Puis re-zip le fichier HTML.sublime-package et remplacer le HTML.sublime-package avec celui que vous venez de créer.
fermez et ouvrez le Sublime texte 3 et c'est fini!