Vés al contingut principal

Generador d'arbre ASCII de franc

Converteix una llista amb sagnat en un arbre de carpetes net (├── └──) per a READMEs i documentació. Sortida Unicode o ASCII simple. S'executa completament al teu navegador.

Funciona sense connexió un cop carregat
Opcions d'importació
Per defecte s'ometen node_modules, .git, la sortida de compilació i les memòries cau.

Sagneu amb espais o tabuladors per niar elements. Cada sagnat més profund es converteix en un fill. Afegeix una nota després de ' # ', ' // ', ' - ' o ' <- ' i s'alinearà com a comentari a la sortida. Enganxa una llista de camins (git ls-files, find, dir /s /b) per niar-los; acaba un nom amb / per marcar una carpeta buida. En importar o deixar anar una carpeta o un .zip només es llegeixen els noms dels fitxers, mai el contingut, i s'ometen node_modules, .git i altres carpetes de compilació (vegeu Opcions d'importació).

Arbre
Estil de comentari
my-project
├── src
│   ├── components
│   │   ├── Button.tsx
│   │   └── Modal.tsx
│   ├── lib
│   │   └── utils.ts
│   └── index.ts  # entry point
├── public
│   └── favicon.ico
├── package.json
└── README.md

💡 Enganxeu una estructura de carpetes (o qualsevol esquema niat) i obteniu un arbre net que podeu inserir en un README, un comentari o documentació. Utilitzeu l'estil ASCII per a entorns que no renderitzen caràcters de dibuix de marcs. Tot s'executa al vostre navegador.

Usos habituals

  • Afegir un arbre de carpetes a READMEGenerar un arbre de estructura de projecte net per documentar el vostre repositori.
  • Documentar l'estructura del projecteCrear un arbre de directoris per a documentació tècnica i wikis.
  • Fer un arbre per a un comentari de codiGenerar un diagrama d'estructura per incrustar en comentaris de codi font.
  • Mostrar un arbre de fitxer en una xerradaCrear un diagrama de directoris net per a diapositives i tutorials.
  • Convertir un esborronaç en un arbreVisualitzar qualsevol esborronaç anidat — no només fitxers — com un arbre.

Com funciona

Documentar una estructura de carpetes en un README normalment significa dibuixar les línies ├── i └── a mà. Això les genera a partir d'una simple llista sagnada.

  1. 1
    Escriviu un esquema sagnat
    Un element per línia; sagna amb espais o tabuladors per niar. La profunditat del sagnat defineix la jerarquia.
  2. 2
    S'analitza en un arbre
    Un analitzador basat en pila converteix el sagnat en una estructura niada, totalment al vostre navegador.
  3. 3
    Es dibuixen els connectors de l'arbre
    Es generen les guies ├──, └── i │ correctes, amb les línies verticals continuades correctament per les branques niades.
  4. 4
    Copieu el resultat
    Seleccioneu connectors Unicode o ASCII simple i copieu l'arbre al vostre README, docs o comentari de codi.

Una senzilla utilitat de text que s'executa totalment al vostre dispositiu — res no es carrega.

Eines relacionades

Preguntes freqüents