Prendre en main l’éditeur

Cette page vous montre les gestes les plus utiles. Les captures sont prises dans l’application Nuxt 4 de démonstration afin que les boutons et les menus correspondent à l’interface réellement testée.

Repérer les zones principales

Vue annotée de l’éditeur avec la barre d’outils, le rail de bloc et la zone d’écriture — La barre d’outils reste en haut, tandis que les commandes propres à un bloc apparaissent au survol.

La barre d’outils regroupe les commandes habituelles. Le rail de bloc apparaît à gauche du contenu lorsque vous passez la souris sur un bloc. Le bouton + ajoute un élément juste après, la poignée sert au déplacement et … ouvre les actions du bloc.

Ajouter rapidement un bloc

Menu d’insertion ouvert dans l’éditeur — Tapez / ou utilisez le bouton + pour ouvrir les commandes d’insertion.

Tapez / dans un paragraphe, puis commencez à écrire le nom de ce que vous cherchez. Vous pouvez utiliser les flèches du clavier pour changer de choix et Entrée pour l’insérer.

Home et End vont directement au premier ou au dernier choix. Échap ferme le menu sans modifier le document.

Déplacer ou dupliquer un bloc

Survolez un bloc puis ouvrez Actions du bloc (…).

Menu d’actions d’un bloc avec monter, descendre, dupliquer et supprimer — Les actions de bloc permettent de réorganiser le document sans glisser-déposer.

Vous pouvez monter, descendre, dupliquer ou supprimer le bloc. La duplication crée un nouvel élément avec le même contenu. Si vous préférez le glisser-déposer, utilisez simplement la poignée du rail.

Travailler avec un bloc de code

Bloc de code avec choix du langage et bouton Copier — Le langage choisi est conservé dans le fence Markdown.

Choisissez le langage dans le sélecteur du bloc. Le bouton Copier envoie uniquement le code dans le presse-papiers. Les métadonnées VitePress plus avancées restent conservées en source lorsqu’elles ne peuvent pas être modifiées visuellement sans risque.

Ajouter une légende à une image

Image sélectionnée avec ses outils et son champ de légende — La légende reste attachée à l’image lorsque le document repasse par le Markdown.

Cliquez sur une image pour afficher ses outils. Saisissez ensuite la légende sous le visuel. Effacer retire la légende sans supprimer l’image.

Vérifier le rendu Markdown

Éditeur et aperçu Markdown affichés côte à côte — L’aperçu sert de contrôle avant publication.

Activez Aperçu lorsque vous voulez vérifier le résultat final. Les tableaux et diagrammes Mermaid y sont rendus, tandis que les syntaxes VitePress conservées en source restent intactes.

Raccourcis à retenir

/ ouvre les commandes d’insertion ;
Ctrl+K ou ⌘K ajoute ou modifie un lien ;
Ctrl+S ou ⌘S déclenche la sauvegarde ;
↑, ↓, Home, End et Échap servent à naviguer dans les menus.

Pour voir une intégration complète, continuez avec l’exemple Nuxt Layer.

Prendre en main l’éditeur ​

Repérer les zones principales ​

Ajouter rapidement un bloc ​

Déplacer ou dupliquer un bloc ​

Travailler avec un bloc de code ​

Ajouter une légende à une image ​

Vérifier le rendu Markdown ​

Raccourcis à retenir ​