web-dev-qa-db-fra.com

Comment ranger l'indentation d'un fichier HTML dans VI?

Comment puis-je réparer l'indentation de ses énormes fichiers HTML qui étaient tout foirés?

J'ai essayé la commande habituelle "gg = G" , qui est ce que j'utilise pour corriger l'indentation des fichiers de code. Cependant, cela ne semblait pas fonctionner correctement sur les fichiers HTML. Il a simplement supprimé toute la mise en forme.

J'ai également essayé de définir :filetype = xml, pour voir si le persuader de penser qu'il s'agissait d'un fichier XML aiderait, mais il ne l'a toujours pas fait.

htmlvimviindentation
113
mmcdole

Avec filetype indent on dans mon .vimrc, Vim met assez bien en retrait les fichiers HTML.

Exemple simple avec une shiftwidth de 2:

<html>
  <body>
    <p>
    text
    </p>
  </body>
</html>
84
marcog

Il y a plusieurs choses qui doivent toutes être en place. Juste pour les résumer en un seul endroit:

Définissez l'option suivante:

:filetype indent on
:set filetype=html           # abbrev -  :set ft=html
:set smartindent             # abbrev -  :set si

Ensuite, déplacez le curseur en haut du fichier et indentez-le à la fin: gg=G
Ou sélectionnez le texte que vous souhaitez mettre en retrait et appuyez sur = l'indenter.

166
tylerl

Le problème principal avec l'indentation intelligente est que si le XML (ou HTML) est placé sur une seule ligne, car il risque de revenir d'une requête curl, alors gg=G ne fera pas l'affaire. Au lieu de cela, je viens de faire l'expérience d'une bonne mise en retrait en utilisant tidy directement appelé depuis VI:

:!tidy -mi -xml -wrap 0 %

En gros, cela indique à VI d’appeler Tidy pour nettoyer un fichier XML qui n’enroule pas les lignes pour les adapter aux lignes par défaut de 68 caractères. J'ai traité un gros fichier XML de 29 Mo et cela a pris 5 ou 6 secondes. Je suppose que pour un fichier HTML, la commande devrait donc être:

:!tidy -mi -html -wrap 0 %

Comme mentionné dans les commentaires, tidy est un outil de base que vous pouvez trouver sur de nombreux systèmes Linux/MacOS de base. Voici la page du projet au cas où vous souhaiteriez l'avoir mais ne pas: HTML Tidy .

J'espère que cela pourrait aider.

50
oscaroscar

Comme l'explique tylerl ci-dessus, définissez les éléments suivants:

:filetype indent on
:set filetype=html
:set smartindent

Toutefois!

Notez que dans vim 7.4, les balises HTML html, head, body et quelques autres sont not indentées par défaut. Cela a du sens, car presque tout le contenu d’un fichier html relève de ces balises. Si vous le souhaitez vraiment, vous pouvez faire en sorte que ces balises soient en retrait de la manière suivante:

:let g:html_indent_inctags = "html,body,head,tbody"

Voir ici et ici pour plus d'informations.

46
Cory Klein

Ceci est ma solution qui fonctionne bien pour ouvrir du HTML "laid" d'une manière bien espacée:

vim fileIn.html -c "set sw=2 | %s/>/>\r/ | execute 'normal gg=G' | set nohlsearch | g/^\\s*\$/d"

La commande sw est parce que ma valeur par défaut est 4, ce qui est trop élevé pour HTML.

La partie suivante ajoute une nouvelle ligne (Vim pense que c'est un retour chariot, soupir) après chaque élément (>)

Puis indenter de nouveau le fichier entier avec =

Puis décochez > (puisque j'ai set hlsearch dans mon vimrc)

Supprimez ensuite toutes les lignes vides/espaces uniquement (voir ici pour plus, ceci est aussi échappé double parce que c'est dans le shell)

Vous pouvez même ajouter | wq! fileOut.html à la fin si vous ne voulez pas entrer du tout dans Vim, mais simplement nettoyer le fichier.

10
adam_0

J'utilise ce script: https://github.com/maksimr/vim-jsbeautify

Dans le lien ci-dessus, vous avez toutes les informations:

  1. Installer
  2. Configurer (copie du premier exemple)
  3. Run :call HtmlBeautify()

Fait le travail magnifiquement!

6
SimonW

Voici une solution très lourde qui vous indentera, ainsi que tous les jolis impressions HTML dont vous ne voulez pas nécessairement vous soucier pendant l'édition.

Tout d’abord, téléchargez Tidy . Assurez-vous d’ajouter le fichier binaire à votre chemin afin de pouvoir l’appeler depuis n’importe quel emplacement.

Créez ensuite un fichier de configuration décrivant votre version HTML préférée. La documentation n’est pas excellente pour Tidy, mais voici un overview , et une liste de toutes les options . Voici mon fichier de configuration:

bare: yes
break-before-br: no
clean: yes
drop-proprietary-attributes: yes
fix-uri: yes
indent-spaces: 4
indent: yes
logical-emphasis: yes
markup: yes
output-xhtml: yes
quiet: yes
quote-marks: yes
replace-color: yes
tab-size: 4
uppercase-tags: no
vertical-space: yes
Word-2000: yes
wrap: 0

Enregistrez ceci sous tidyrc_html.txt dans votre dossier ftplugin (sous vimfiles).

Encore un fichier: ajoutez la ligne suivante à (ou créez) html.vim, également dans ftplugin:

map <leader>tidy :%! tidy -config ~/vimfiles/ftplugin/tidyrc_html.txt <CR>

Pour l'utiliser, ouvrez simplement un fichier HTML et tapez /tidy. (Ce / est la clé <leader>.)

Voilà! Ce n’est pas une solution rapide, loin de là, mais vous êtes maintenant un peu mieux équipé pour éditer ces énormes fichiers HTML.

4
Lemur

Avez-vous essayé d'utiliser le script d'indentation HTML sur le site Vim?

4
JaredPar

Vous pouvez intégrer les deux tidy et html-beautify automatiquement en installant le plug-in vim-autoformat . Vous pourrez ensuite exécuter le formateur installé avec une seule frappe.

2
Chiel ten Brinke

J'ai essayé la commande habituelle "gg = G", qui est ce que j'utilise pour corriger l'indentation des fichiers de code. Cependant, cela ne semblait pas fonctionner correctement sur les fichiers HTML. Il a simplement supprimé toute la mise en forme.

Si l'autoformat/indent gg=G de vim semble "cassé" (comme l'indentation gauche à chaque ligne), il est fort probable que le plug-in indent ne soit pas activé/chargé. Cela devrait vraiment donner un message d'erreur au lieu de faire un mauvais retrait, sinon les utilisateurs pensent que la fonctionnalité de mise en forme automatique/retrait est horrible, alors qu'elle est plutôt bonne.

Pour vérifier si le plug-in d'indent est activé/chargé, exécutez :scriptnames. Voir si .../indent/html.vim est dans la liste. Sinon, cela signifie que le plugin n'est pas chargé. Dans ce cas, ajoutez cette ligne à ~/.vimrc:

filetype plugin indent on

Maintenant, si vous ouvrez le fichier et exécutez :scriptnames, vous devriez voir .../indent/html.vim. Puis lancez gg=G, qui devrait maintenant faire le bon format automatique/indent correct. (Bien que cela n’ajoute pas de saut de ligne, donc si tout le code html est sur une seule ligne, il ne sera pas mis en retrait).

Remarque: si vous exécutez :filetype plugin indent on sur la ligne de commande vim au lieu de ~/.vimrc, vous devez rouvrir le fichier :e.

De plus, vous n'avez pas à vous soucier des paramètres autoindent et smartindent, ils ne sont pas pertinents pour cela.

0
wisbucky