那些遇到过的问题

有没有办法在Github README.md中表示目录树？

55 markdown github

在我的Githubs repos 文档中,我想表示一个像这样的目录树结构:

在此输入图像描述

有没有办法用Github风味的降价来做到这一点,除了用ascii艺术创造它？

所以基本上就像这个问题,但我想知道是否有一个特定的github解决方案.

Jon*_* C. 72

我用这种方式得到了解决问题的方法:

  1. tree在bash中插入命令.

    例

    在此输入图像描述

  2. 在github存储库中创建一个README.md并复制bash的页面

  3. 插入降价代码

    例

    在此输入图像描述

  4. 看到输出并高兴=)

    在此输入图像描述

  • 请注意，在某些情况下，使用“\```bash ... \```”会突出显示某些单词。相反，您可以使用“pre”标签：“<pre> ... </pre>”。 (3认同)
  • 这是一个你可以复制的例子，我在 [github](https://raw.githubusercontent.com/aerobatic/markdown-content/master/docs/directory-structure.md) 上找到了这个 (2认同)

Sim*_*mon 33

我写了一个小脚本,可以解决这个问题:

#!/bin/bash

#File: tree-md

tree=$(tree -tf --noreport -I '*~' --charset ascii $1 |
       sed -e 's/| \+/  /g' -e 's/[|`]-\+/ */g' -e 's:\(* \)\(\(.*/\)\([^/]\+\)\):\1[\4](\2):g')

printf "# Project tree\n\n${tree}"
Run Code Online (Sandbox Code Playgroud)

例:

原始树命令:

$ tree
.
??? dir1
?   ??? file11.ext
?   ??? file12.ext
??? dir2
?   ??? file21.ext
?   ??? file22.ext
?   ??? file23.ext
??? dir3
??? file_in_root.ext
??? README.md

3 directories, 7 files
Run Code Online (Sandbox Code Playgroud)

降价树命令:

$ ./tree-md .
# Project tree

.
 * [tree-md](./tree-md)
 * [dir2](./dir2)
   * [file21.ext](./dir2/file21.ext)
   * [file22.ext](./dir2/file22.ext)
   * [file23.ext](./dir2/file23.ext)
 * [dir1](./dir1)
   * [file11.ext](./dir1/file11.ext)
   * [file12.ext](./dir1/file12.ext)
 * [file_in_root.ext](./file_in_root.ext)
 * [README.md](./README.md)
 * [dir3](./dir3)
Run Code Online (Sandbox Code Playgroud)

渲染结果:

(链接在Stackoverflow中不可见...)

项目树
  • 树-MD
  • DIR2
    • file21.ext
    • file22.ext
    • file23.ext
  • DIR1
    • file11.ext
    • file12.ext
  • file_in_root.ext
  • README.md
  • DIR3

  • 这对 mac 不起作用。！！我使用brew install tr​​ee来安装树。 (2认同)

Oli*_*ews 24

不直接,没有.你必须手工创造并把它放在自己身上.假设您在本地使用*nix框并且正在使用utf,那么树将很好地生成它(我相信这就是生成上面使用的示例).

假设你的意思是readme.md作为文档目标,那么我认为你可以自动化它的唯一方法是运行tree并将其嵌入到自述文件中的git预提交钩子.你想做一个差异,以确保你只更新了自述文件,如果输出更改.

如果您通过github页面维护单独的文档,那么您可以做的是切换到本地使用jekyll(或其他生成器)并自己推送静态页面.然后,你可以潜在地实现你想要的更改作为插件/ shell脚本*/手动更改(如果它们变化不大),或者使用与上面相同的方法.

*如果将其集成到提交挂钩中,则可以避免添加任何额外的步骤来更改页面.

  • 在Mac上，您可以使用[Homebrew]（https://brew.sh/）安装`tree`命令，即`brew install tr​​ee`。然后从我要代表的目录中运行`tree'。>> tree.txt`，然后复制并编辑我的README.md文件中的文本。确实满足了我的需求！ (2认同)
  • 为什么这个答案被接受？有许多好的实用程序可用于执行此操作。请不要执行本手册。看看这个。https://github.com/michalbe/md-file-tree (2认同)

Joh*_*rne 15

我制作了一个节点模块来自动执行这项任务:mddir

用法

node mddir"../relative/path/"

要安装:npm install mddir -g

要为当前目录生成markdown:mddir

为任何绝对路径生成:mddir/absolute/path

为相对路径生成:mddir~/Documents/whatever.

md文件在您的工作目录中生成.

目前忽略node_modules和.git文件夹.

故障排除

如果您收到错误'node\r \n:No such file or directory',则问题是您的操作系统使用不同的行结尾,并且如果没有将行结束样式显式设置为Unix,则mddir无法解析它们.这通常会影响Windows,但也会影响某些版本的Linux.必须在mddir npm全局bin文件夹中执行将行结尾设置为Unix样式.

行结尾修复

获取npm bin文件夹路径:

npm config get prefix

Cd进入该文件夹

brew安装dos2unix

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

这会将行结尾转换为Unix而不是Dos

然后正常运行:node mddir"../relative/path/".

示例生成的markdown文件结构'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
Run Code Online (Sandbox Code Playgroud)

小智 14

在Linux中，该tree命令可用于列出目录下的所有文件/目录。

\n

如果有人只想列出目录而不是文件，请使用以下-d选项：

\n
$ tree -d\n\ndata\n\xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 cats_vs_dogs\n\xe2\x94\x82   \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 test_cat_dog\n\xe2\x94\x82   \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 testing\n\xe2\x94\x82   \xe2\x94\x82   \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 cats\n\xe2\x94\x82   \xe2\x94\x82   \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 dogs\n\xe2\x94\x82   \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 training\n\xe2\x94\x82       \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 cats\n\xe2\x94\x82       \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 dogs\n\xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 PetImages\n    \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 Cat\n    \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 Dog\n
Run Code Online (Sandbox Code Playgroud)\n

复制输出并将其包装```在 markdown 文件中的 3 个反引号中。

\n

joe*_*epi 9

执行此操作的最佳方法是在三重反引号中包围树以表示代码块.有关详细信息,请参阅markdown docs:http: //daringfireball.net/projects/markdown/syntax#code

  • 与OP要求的不同，但正是我需要的提示。谢谢！ (2认同)

jon*_*von 8

这是一个git alias对我有用的有用的。

git config --global alias.tree '! git ls-tree --full-name --name-only -t -r HEAD | sed -e "s/[^-][^\/]*\//   |/g" -e "s/|\([^ ]\)/|-- \1/"'
Run Code Online (Sandbox Code Playgroud)

这是输出 git tree

jonavon@XPS13:~/projects/roman-numerals$ git tree
.gitignore
pom.xml
src
   |-- main
   |   |-- java
   |   |   |-- com
   |   |   |   |-- foxguardsolutions
   |   |   |   |   |-- jonavon
   |   |   |   |   |   |-- AbstractFile.java
   |   |   |   |   |   |-- roman
   |   |   |   |   |   |   |-- Main.java
   |   |   |   |   |   |   |-- Numeral.java
   |   |   |   |   |   |   |-- RomanNumberInputFile.java
   |   |   |   |   |   |   |-- RomanNumeralToDecimalEvaluator.java
   |-- test
   |   |-- java
   |   |   |-- com
   |   |   |   |-- foxguardsolutions
   |   |   |   |   |-- jonavon
   |   |   |   |   |   |-- roman
   |   |   |   |   |   |   |-- InterpretSteps.java
   |   |   |   |   |   |   |-- RunCukesTest.java
   |   |-- resources
   |   |   |-- com
   |   |   |   |-- foxguardsolutions
   |   |   |   |   |-- jonavon
   |   |   |   |   |   |-- roman
   |   |   |   |   |   |   |-- Interpret.feature
   |   |   |-- sample-input.txt
Run Code Online (Sandbox Code Playgroud)

可比较的tree命令

jonavon@XPS13:~/projects/roman-numerals$ tree -n
.
??? pom.xml
??? src
?   ??? main
?   ?   ??? java
?   ?       ??? com
?   ?           ??? foxguardsolutions
?   ?               ??? jonavon
?   ?                   ??? AbstractFile.java
?   ?                   ??? roman
?   ?                       ??? Main.java
?   ?                       ??? Numeral.java
?   ?                       ??? RomanNumberInputFile.java
?   ?                       ??? RomanNumeralToDecimalEvaluator.java
?   ??? test
?       ??? java
?       ?   ??? com
?       ?       ??? foxguardsolutions
?       ?           ??? jonavon
?       ?               ??? roman
?       ?                   ??? InterpretSteps.java
?       ?                   ??? RunCukesTest.java
?       ??? resources
?           ??? com
?           ?   ??? foxguardsolutions
?           ?       ??? jonavon
?           ?           ??? roman
?           ?               ??? Interpret.feature
?           ??? sample-input.txt
??? target
    ??? classes
    ?   ??? com
    ?       ??? foxguardsolutions
    ?           ??? jonavon
    ?               ??? AbstractFile.class
    ?               ??? roman
    ?                   ??? Main.class
    ?                   ??? Numeral.class
    ?                   ??? RomanNumberInputFile.class
    ?                   ??? RomanNumeralToDecimalEvaluator.class
    ??? generated-sources
    ?   ??? annotations
    ??? maven-status
        ??? maven-compiler-plugin
            ??? compile
                ??? default-compile
                    ??? createdFiles.lst
                    ??? inputFiles.lst

30 directories, 17 files
Run Code Online (Sandbox Code Playgroud)

显然 tree 有更好的输出，但我喜欢这种方式，因为它只显示相关的源文件而不是 .git 目录和编译的二进制文件。

Man*_*uri 8

是的，有一种方法，在你的 readme.md 文件中，只需复制并粘贴你在三个反引号之间生成的树，就像你在 markdown 中编写代码一样，它就会起作用。请参阅下面的附件。``` your tree ```

在此输入图像描述

  • 如果有人想知道，这里是 vscode 扩展：[链接](https://marketplace.visualstudio.com/items?itemName=Shinotatwu-DS.file-tree-generator) (3认同)

Raú*_*año 6

您还可以检查这个树扩展包。通过使用 Node >= 6.x，它可以用作命令行应用程序。

它与树非常相似tree，但也可以选择配置树中的最大深度，这是它的可怕之处之一。您也可以使用.gitignore文件进行过滤。

在此输入图像描述

更新

您还可以使用此 VsCode 插件（tree-extended-vscode），它更易于使用，您可以从 VSCode 的可视界面执行此操作，只需将参数传递到那里即可。

nag*_*547 6

上述解决方案都不适用于我的 Mac。

我发现的最佳解决方案是使用此处创建的实用程序。

https://github.com/michalbe/md-file-tree

安装该实用程序npm install md-file-tree -g后，您只需运行即可获取所有文件树

md-file-tree . > README.md
Run Code Online (Sandbox Code Playgroud)

归档时间：

查看次数：

80738 次

最近记录：

6 年，9 月 前
相关归档
将原始GitHub存储库中的新更新提取到分叉的GitHub存储库中 587
GitHub - 无法连接到github 443窗口/无法连接到gitHub - 没有错误 155
在代码块中添加重点github风格的markdown 30
错误跟踪器/版本控制集成如何与典型的git工作流程协同工作？ 15
发送用户使用预先填充的错误数据创建新的GitHub问题 9
TeamCity触发拉取请求与合并时的触发器 5
Github 通知：明确与一般的“PR 审查请求” 5
GCP Cloud Build 触发器“推送新标签”无法正常工作 5
Github URL用于创建具有特定名称的新文件？ 3
用于现代 C++ 线程安全的 JSON？ 1
难疑归档
如何在JavaScript中验证电子邮件地址？ 4099
package.json中的波浪号(〜)和插入符号(^)有什么区别？ 3111
如何在jQuery中选择具有多个类的元素？ 1985
我怎样才能找到带有Mathematica的Waldo？ 1538
如何在Javascript中的数组开头添加新的数组元素？ 1476
[Flags]枚举属性在C#中意味着什么？ 1383
varchar和nvarchar有什么区别？ 1300
获取数据库中所有表的大小 1180
require,include,require_once和include_once之间的区别？ 1166
如何删除旧的Docker容器 1162