Quiero describir las estructuras de directorios y archivos en algunas de mis publicaciones de blog de Jekyll, ¿Markdown proporciona una forma ordenada de generar tal cosa?

Por ejemplo, puede ver en este enlace en el sitio web de Jekyll que la estructura de directorios y archivos se muestra en la página de manera muy clara:

.
├── _config.yml
├── _drafts
│   ├── begin-with-the-crazy-ideas.textile
│   └── on-simplicity-in-technology.markdown
├── _includes
│   ├── footer.html
│   └── header.html
├── _layouts
│   ├── default.html
│   └── post.html
├── _posts
│   ├── 2007-10-29-why-every-programmer-should-play-nethack.textile
│   └── 2009-04-26-barcamp-boston-4-roundup.textile
├── _data
│   └── members.yml
├── _site
└── index.html

Creo que los caracteres de bloque de línea anteriores son Unicode (como se describe en esta respuesta aquí ), pero no estoy seguro de cómo Markdown o los diferentes navegadores los manejarán. Tenía la esperanza de que Markdown había incluido alguna forma de hacer esto que se muestra como los caracteres Unicode anteriores tal vez.

Si le preocupan los caracteres Unicode, puede usar ASCII para construir las estructuras, por lo que su estructura de ejemplo se convierte en

.
+-- _config.yml
+-- _drafts
|   +-- begin-with-the-crazy-ideas.textile
|   +-- on-simplicity-in-technology.markdown
+-- _includes
|   +-- footer.html
|   +-- header.html
+-- _layouts
|   +-- default.html
|   +-- post.html
+-- _posts
|   +-- 2007-10-29-why-every-programmer-should-play-nethack.textile
|   +-- 2009-04-26-barcamp-boston-4-roundup.textile
+-- _data
|   +-- members.yml
+-- _site
+-- index.html

Que es similar al formato que treeutiliza si selecciona la ANSIsalida.

Seguí un ejemplo en otro repositorio y envolví la estructura del directorio dentro de un par de triples tics ( ```):

```
project
│   README.md
│   file001.txt    
│
└───folder1
│   │   file011.txt
│   │   file012.txt
│   │
│   └───subfolder1
│       │   file111.txt
│       │   file112.txt
│       │   ...
│   
└───folder2
    │   file021.txt
    │   file022.txt
```

Puedes usar el árbol para generar algo muy similar a tu ejemplo. Una vez que tenga el resultado, puede envolverlo en una <pre>etiqueta para preservar el formato de texto sin formato.

Si está utilizando VS Code, esta es una extensión increíble para generar árboles de archivos. https://marketplace.visualstudio.com/items?itemName=Shinotatwu-DS.file-tree-generator

Agregado directamente a Markdown ...

📦quakehunter
 ┣ 📂client
 ┣ 📂node_modules
 ┣ 📂server
 ┃ ┗ 📜index.js
 ┣ 📜.gitignore
 ┣ 📜package-lock.json
 ┗ 📜package.json

Hice un módulo de nodo para automatizar esta tarea: mddir

Uso

nodo mddir "../relative/path/"

Para instalar: npm install mddir -g

Para generar rebajas para el directorio actual: mddir

Para generar para cualquier ruta absoluta: mddir / absolute / path

Para generar una ruta relativa: mddir ~ / Documentos / lo que sea.

El archivo md se genera en su directorio de trabajo.

Actualmente ignora los módulos node_modules y .git.

Solución de problemas

Si recibe el error 'nodo \ r: No existe tal archivo o directorio', el problema es que su sistema operativo utiliza diferentes finales de línea y mddir no puede analizarlos sin que configure explícitamente el estilo de final de línea en Unix. Esto generalmente afecta a Windows, pero también a algunas versiones de Linux. La configuración de los finales de línea al estilo Unix debe realizarse dentro de la carpeta bin global mddir npm.

Fijación de terminaciones de línea

Obtenga la ruta de la carpeta bin de npm con:

npm config get prefix

Cd en esa carpeta

instalar brew dos2unix

dos2unix lib / node_modules / mddir / src / mddir.js

Esto convierte las terminaciones de línea a Unix en lugar de Dos

Luego, ejecute normalmente con: node mddir "../relative/path/".

Ejemplo generado estructura de archivo de rebajas 'directorioLista.md'

    |-- .bowerrc
    |-- .jshintrc
    |-- .jshintrc2
    |-- Gruntfile.js
    |-- README.md
    |-- bower.json
    |-- karma.conf.js
    |-- package.json
    |-- app
        |-- app.js
        |-- db.js
        |-- directoryList.md
        |-- index.html
        |-- mddir.js
        |-- routing.js
        |-- server.js
        |-- _api
            |-- api.groups.js
            |-- api.posts.js
            |-- api.users.js
            |-- api.widgets.js
        |-- _components
            |-- directives
                |-- directives.module.js
                |-- vendor
                    |-- directive.draganddrop.js
            |-- helpers
                |-- helpers.module.js
                |-- proprietary
                    |-- factory.actionDispatcher.js
            |-- services
                |-- services.cardTemplates.js
                |-- services.cards.js
                |-- services.groups.js
                |-- services.posts.js
                |-- services.users.js
                |-- services.widgets.js
        |-- _mocks
            |-- mocks.groups.js
            |-- mocks.posts.js
            |-- mocks.users.js
            |-- mocks.widgets.js

Como ya se recomienda, puede usar tree. Pero para usarlo junto con texto reestructurado se requerían algunos parámetros adicionales.

El treeresultado estándar no se imprimirá si está utilizando pandocpara producir pdf.

tree --dirsfirst --charset=ascii /path/to/directoryproducirá un bonito ASCIIárbol que se puede integrar en su documento de esta manera:

.. code::
.
|-- ContentStore
|   |-- de-DE
|   |   |-- art.mshc
|   |   |-- artnoloc.mshc
|   |   |-- clientserver.mshc
|   |   |-- noarm.mshc
|   |   |-- resources.mshc
|   |   `-- windowsclient.mshc
|   `-- en-US
|       |-- art.mshc
|       |-- artnoloc.mshc
|       |-- clientserver.mshc
|       |-- noarm.mshc
|       |-- resources.mshc
|       `-- windowsclient.mshc
`-- IndexStore
    |-- de-DE
    |   |-- art.mshi
    |   |-- artnoloc.mshi
    |   |-- clientserver.mshi
    |   |-- noarm.mshi
    |   |-- resources.mshi
    |   `-- windowsclient.mshi
    `-- en-US
        |-- art.mshi
        |-- artnoloc.mshi
        |-- clientserver.mshi
        |-- noarm.mshi
        |-- resources.mshi
        `-- windowsclient.mshi

Escribí esto para mi lista de archivos de Dropbox.

sed se utiliza para eliminar rutas completas de ruta de archivo / carpeta con enlace simbólico después ->

Lamentablemente, las pestañas se pierden. Utilizando zshpuedo preservar pestañas.

! / usr / bin / env bash

#!/usr/bin/env zsh

F1='index-2.md' #With hyperlinks
F2='index.md'

if [ -e $F1 ];then
    rm $F1
fi

if [ -e $F2 ];then
    rm $F2
fi

DATA=`tree --dirsfirst -t -Rl --noreport | \
    sed 's/->.*$//g'`             # Remove symlink adress and ->

echo -e '```\n' ${DATA} '\n```' > $F1  # Markdown needs triple back ticks for <pre>

# With the power of piping, creating HTML tree than pipe it
# to html2markdown program, creates cool markdown file with hyperlinks.

DATA=`tree --dirsfirst -t -Rl --noreport -H http://guneysu.pancakeapps.com`
echo $DATA | \
    sed 's/\r\r/\n/g' | \
    html2markdown | \
    sed '/^\s*$/d' | \
    sed 's/\# Directory Tree//g' | \
        > $F2

Las salidas como esta:

```
 .
├── 2013 
│   └── index.markdown
├── 2014 
│   └── index.markdown
├── 2015 
│   └── index.markdown
├── _posts 
│   └── 2014-12-27-2014-yili-degerlendirmesi.markdown
├── _stash 
└── update.sh 
```

[BASE_URL/](BASE_URL/)
├── [2013](BASE_URL/2013/)
│   └── [index.markdown](BASE_URL/2013/index.markdown)
├── [2014](BASE_URL/2014/)
│   └── [index.markdown](BASE_URL/2014/index.markdown)
├── [2015](BASE_URL/2015/)
│   └── [index.markdown](BASE_URL/2015/index.markdown)
├── [_posts](BASE_URL/_posts/)
│   └── [2014-12-27-2014-yili-degerlendirmesi.markdown](_posts/2014-12-27-2014-yili-degerlendirmesi.markdown)
├── [_stash](BASE_URL/_stash/)
├── [index-2.md](BASE_URL/index-2.md)
└── [update.sh](BASE_URL/update.sh)
* * *
tree v1.6.0 © 1996 - 2011 by Steve Baker and Thomas Moore
HTML output hacked and copyleft © 1998 by Francesc Rocher
Charsets / OS/2 support © 2001 by Kyosuke Tokoro

Si está utilizando el editor Atom, puede lograr esto con el paquete ascii-tree .

Puedes escribir el siguiente árbol:

root
+-- dir1
    +--file1
+-- dir2
    +-- file2

y conviértalo al siguiente seleccionándolo y presionando ctrl-alt-t:

root
├── dir1
│   └── file1
└── dir2
    └── file2

Bajo OSX, usando reveal.js, tengo un problema de representación si solo uso treey luego copio / pego la salida: aparecen símbolos extraños.

He encontrado 2 posibles soluciones.

1) Use charset ascii y simplemente copie / pegue la salida en el archivo de descuento

tree -L 1 --charset=ascii

2) Use directamente HTML y Unicode en el archivo de descuento

<pre>
.
&#8866; README.md
&#8866; docs
&#8866; e2e
&#8866; karma.conf.js
&#8866; node_modules
&#8866; package.json
&#8866; protractor.conf.js
&#8866; src
&#8866; tsconfig.json
&#8985; tslint.json
</pre>

Espero eso ayude.

Sugeriría usar wasabi, entonces puedes usar la sensación de markdown-ish de esta manera

root/ # entry comments can be inline after a '#'
      # or on their own line, also after a '#'

  readme.md # a child of, 'root/', it's indented
            # under its parent.

  usage.md  # indented syntax is nice for small projects
            # and short comments.

  src/          # directories MUST be identified with a '/'
    fileOne.txt # files don't need any notation
    fileTwo*    # '*' can identify executables
    fileThree@  # '@' can identify symlinks

y lanzar esa sintaxis exacta a la biblioteca js para esto

Si desea generarlo dinámicamente, le recomiendo usar Frontend-md . Es simple de usar.

Hay un módulo NPM para esto:

npm dree

Le permite tener una representación de un árbol de directorios como una cadena o un objeto. Usarlo con la línea de comando le permitirá guardar la representación en un archivo txt.

Ejemplo:

$ npm dree parse myDirectory --dest ./generated --name tree