informatique:outils:vim:convertir_en_html
Table des matières
Convertir en HTML
Il est possible de convertir le contenu d'un fichier en HTML en utilisant TOhtml
en mode visuel.
Il est possible de le faire également en mode CLI de la manière suivante :
# Convertir tout le fichier vim -e <filename> -c "set nobackup" -c :TOhtml -c wq -c :q # Convertir une partie du fichier (de la ligne 10 à la ligne 20 incluse) vim -e <filename> -c "set nobackup" -c :10,20TOhtml -c wq -c :q
Avec l'utilisation du thème moria, il est possible de changer la coloration syntaxique de base :
# Avec un arrière plan foncé vim -e <filename> -c "set nobackup" -c "let moria_style='dark'" -c ":colorscheme moria" -c :TOhtml -c wq -c :q # Avec un arrière plan clair vim -e <filename> -c "set nobackup" -c "let moria_style='light'" -c ":colorscheme moria" -c :TOhtml -c wq -c :q
Il est intéressant de pouvoir convertir le fichier HTML généré en image pour pouvoir l'inclure dans une documentation. Pour cela, il est possible d'utiliser wkhtmltoimage
, firefox
en mode headless ou encore Puppeteer
.
Exemple
Fichier source
- event.py
class Card: def __init__(self, event, person): self.event=event self.person=person def message(self): print(f"Happy {self.event} {self.person}!") card = Card('birthday', 'Charles') card.message()
Résultat avec le thème sombre
- event.py.dark.html
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>~/event.py.html</title> <meta name="Generator" content="Vim/8.2"> <meta name="plugin-version" content="vim8.1_v2"> <meta name="syntax" content="python"> <meta name="settings" content="number_lines,use_css,pre_wrap,no_foldcolumn,expand_tabs,line_ids,prevent_copy=,use_input_for_pc=fallback"> <meta name="colorscheme" content="moria"> <style> <!-- pre { white-space: pre-wrap; font-family: monospace; color: #c0c0c0; background-color: #000000; } body { font-family: monospace; color: #c0c0c0; background-color: #000000; } * { font-size: 1em; } .LineNr { color: #ffff00; } .Constant { color: #ff40ff; } .Identifier { color: #00ffff; font-weight: bold; } .Statement { color: #ffff00; } --> </style> <script> <!-- /* function to open any folds containing a jumped-to line before jumping to it */ function JumpToLine() { var lineNum; lineNum = window.location.hash; lineNum = lineNum.substr(1); /* strip off '#' */ if (lineNum.indexOf('L') == -1) { lineNum = 'L'+lineNum; } var lineElem = document.getElementById(lineNum); /* Always jump to new location even if the line was hidden inside a fold, or * we corrected the raw number to a line ID. */ if (lineElem) { lineElem.scrollIntoView(true); } return true; } if ('onhashchange' in window) { window.onhashchange = JumpToLine; } --> </script> </head> <body onload='JumpToLine();'> <pre id='vimCodeElement'> <span id="L1" class="LineNr"> 1 </span><span class="Statement">class</span> <span class="Identifier">Card</span>: <span id="L2" class="LineNr"> 2 </span> <span class="Statement">def</span> <span class="Identifier">__init__</span>(self, event, person): <span id="L3" class="LineNr"> 3 </span> self.event=event <span id="L4" class="LineNr"> 4 </span> self.person=person <span id="L5" class="LineNr"> 5 </span> <span id="L6" class="LineNr"> 6 </span> <span class="Statement">def</span> <span class="Identifier">message</span>(self): <span id="L7" class="LineNr"> 7 </span> <span class="Identifier">print</span>(f<span class="Constant">"</span><span class="Constant">Happy {self.event} {self.person}!</span><span class="Constant">"</span>) <span id="L8" class="LineNr"> 8 </span> <span id="L9" class="LineNr"> 9 </span>card = Card(<span class="Constant">'</span><span class="Constant">birthday</span><span class="Constant">'</span>, <span class="Constant">'</span><span class="Constant">Charles</span><span class="Constant">'</span>) <span id="L10" class="LineNr">10 </span>card.message() </pre> </body> </html> <!-- vim: set foldmethod=manual : -->
Résultat avec le thème clair
- event.py.light.html
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>~/event.py.html</title> <meta name="Generator" content="Vim/8.2"> <meta name="plugin-version" content="vim8.1_v2"> <meta name="syntax" content="python"> <meta name="settings" content="number_lines,use_css,pre_wrap,no_foldcolumn,expand_tabs,line_ids,prevent_copy=,use_input_for_pc=fallback"> <meta name="colorscheme" content="moria"> <style> <!-- pre { white-space: pre-wrap; font-family: monospace; color: #000000; background-color: #ffffff; } body { font-family: monospace; color: #000000; background-color: #ffffff; } * { font-size: 1em; } .LineNr { color: #af5f00; } .Constant { color: #c00000; } .Identifier { color: #008080; } .Statement { color: #af5f00; } --> </style> <script> <!-- /* function to open any folds containing a jumped-to line before jumping to it */ function JumpToLine() { var lineNum; lineNum = window.location.hash; lineNum = lineNum.substr(1); /* strip off '#' */ if (lineNum.indexOf('L') == -1) { lineNum = 'L'+lineNum; } var lineElem = document.getElementById(lineNum); /* Always jump to new location even if the line was hidden inside a fold, or * we corrected the raw number to a line ID. */ if (lineElem) { lineElem.scrollIntoView(true); } return true; } if ('onhashchange' in window) { window.onhashchange = JumpToLine; } --> </script> </head> <body onload='JumpToLine();'> <pre id='vimCodeElement'> <span id="L1" class="LineNr"> 1 </span><span class="Statement">class</span> <span class="Identifier">Card</span>: <span id="L2" class="LineNr"> 2 </span> <span class="Statement">def</span> <span class="Identifier">__init__</span>(self, event, person): <span id="L3" class="LineNr"> 3 </span> self.event=event <span id="L4" class="LineNr"> 4 </span> self.person=person <span id="L5" class="LineNr"> 5 </span> <span id="L6" class="LineNr"> 6 </span> <span class="Statement">def</span> <span class="Identifier">message</span>(self): <span id="L7" class="LineNr"> 7 </span> <span class="Identifier">print</span>(f<span class="Constant">"</span><span class="Constant">Happy {self.event} {self.person}!</span><span class="Constant">"</span>) <span id="L8" class="LineNr"> 8 </span> <span id="L9" class="LineNr"> 9 </span>card = Card(<span class="Constant">'</span><span class="Constant">birthday</span><span class="Constant">'</span>, <span class="Constant">'</span><span class="Constant">Charles</span><span class="Constant">'</span>) <span id="L10" class="LineNr">10 </span>card.message() </pre> </body> </html> <!-- vim: set foldmethod=manual : -->
informatique/outils/vim/convertir_en_html.txt · Dernière modification : 2025/01/02 09:25 de alexis