Ich möchte Verzeichnis- und Dateistrukturen in einigen meiner Jekyll-Blog-Beiträge beschreiben. Bietet Markdown eine gute Möglichkeit, so etwas auszugeben?

Unter diesem Link auf der Jekyll-Website können Sie beispielsweise sehen, dass die Verzeichnis- und Dateistruktur auf der Seite sehr übersichtlich ausgegeben wird:

.
├── _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

Ich glaube, dass die obigen Zeilenblockzeichen Unicode sind (wie in dieser Antwort hier beschrieben ), aber ich bin nicht sicher, wie Markdown oder andere Browser damit umgehen werden. Ich hatte gehofft, dass Markdown eine Möglichkeit dazu enthalten hatte, die vielleicht als Unicode-Zeichen oben ausgegeben wird.

Wenn Sie sich Gedanken über Unicode-Zeichen machen, können Sie die Strukturen mit ASCII erstellen, sodass Ihre Beispielstruktur wird

.
+-- _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

Dies ähnelt dem Format, treedas bei Auswahl der ANSIAusgabe verwendet wird.

Ich folgte einem Beispiel in einem anderen Repository und verpackte die Verzeichnisstruktur in ein Paar dreifacher Backticks ( ```):

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

Sie können einen Baum verwenden , um etwas zu generieren, das Ihrem Beispiel sehr ähnlich ist. Sobald Sie die Ausgabe haben, können Sie sie in ein <pre>Tag einschließen, um die Nur-Text-Formatierung beizubehalten.

Wenn Sie VS-Code verwenden, ist dies eine großartige Erweiterung zum Generieren von Dateibäumen. https://marketplace.visualstudio.com/items?itemName=Shinotatwu-DS.file-tree-generator

Direkt zum Markdown hinzugefügt ...

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

Ich habe ein Knotenmodul erstellt, um diese Aufgabe zu automatisieren: mddir

Verwendung

Knoten mddir "../relative/path/"

So installieren Sie: npm install mddir -g

So generieren Sie einen Abschlag für das aktuelle Verzeichnis: mddir

So generieren Sie für einen beliebigen absoluten Pfad: mddir / absolute / path

So generieren Sie für einen relativen Pfad: mddir ~ / Documents / Whatever.

Die MD-Datei wird in Ihrem Arbeitsverzeichnis generiert.

Ignoriert derzeit die Ordner node_modules und .git.

Fehlerbehebung

Wenn Sie die Fehlermeldung 'node \ r: Keine solche Datei oder kein solches Verzeichnis' erhalten, besteht das Problem darin, dass Ihr Betriebssystem unterschiedliche Zeilenenden verwendet und mddir diese nicht analysieren kann, ohne dass Sie den Zeilenendenstil explizit auf Unix setzen. Dies betrifft normalerweise Windows, aber auch einige Linux-Versionen. Das Festlegen von Zeilenenden auf den Unix-Stil muss im globalen bin-Ordner mddir npm erfolgen.

Zeilenenden reparieren

Holen Sie sich den npm bin Ordnerpfad mit:

npm config get prefix

CD in diesen Ordner

brauen install dos2unix

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

Dadurch werden Zeilenenden in Unix anstelle von Dos konvertiert

Führen Sie dann wie gewohnt aus mit: node mddir "../relative/path/".

Beispiel generierte Markdown-Dateistruktur 'directoryList.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

Wie bereits empfohlen, können Sie verwenden tree. Für die Verwendung zusammen mit umstrukturiertem Text waren jedoch einige zusätzliche Parameter erforderlich.

Die Standardausgabe treewird nicht gedruckt, wenn Sie PDF-Dateien pandocerstellen.

tree --dirsfirst --charset=ascii /path/to/directoryerzeugt einen schönen ASCIIBaum, der wie folgt in Ihr Dokument integriert werden kann:

.. 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

Ich habe dies für meine Dropbox-Dateiliste geschrieben.

sed wird zum Entfernen der vollständigen Pfade des nachfolgenden Symbols für verknüpfte Dateien / Ordner verwendet ->

Leider gehen Tabs verloren. Mit kann zshich Tabs beibehalten.

! / 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

Die Ausgaben wie folgt:

```
 .
├── 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

Wenn Sie den Atom-Editor verwenden, können Sie dies mit dem ASCII-Tree- Paket erreichen.

Sie können den folgenden Baum schreiben:

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

und konvertieren Sie es in Folgendes, indem Sie es auswählen und drücken ctrl-alt-t:

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

Unter OSX habe reveal.jsich ein Rendering-Problem, wenn ich nur Benutzer bin treeund dann die Ausgabe kopiere / einfüge: Es erscheinen seltsame Symbole.

Ich habe 2 mögliche Lösungen gefunden.

1) Verwenden Sie charset ascii und kopieren Sie die Ausgabe einfach in die Markdown-Datei

tree -L 1 --charset=ascii

2) Verwenden Sie direkt HTML und Unicode in der Markdown-Datei

<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>

Ich hoffe es hilft.

Ich würde vorschlagen, Wasabi zu verwenden, dann können Sie entweder das Markdown-Gefühl so verwenden

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

und werfen diese genaue Syntax in der js Bibliothek für diese

Wenn Sie es dynamisch generieren möchten, empfehle ich die Verwendung von Frontend-md . Es ist einfach zu bedienen.

Hierfür gibt es ein NPM-Modul:

npm dree

Sie können einen Verzeichnisbaum als Zeichenfolge oder Objekt darstellen. Wenn Sie es mit der Befehlszeile verwenden, können Sie die Darstellung in einer txt-Datei speichern.

Beispiel:

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