1.0.3 • Published 7 years ago
readme-diagram v1.0.3
readme diagrams generator
Generate diagrams in your readme files like this one:
Note left of user: Create readme with code block and image placeholder
user->generator: Start generator
Note right of generator: Scans for code blocks and image placeholders
Note right of generator: Creates diagrams
generator->user: Code ready to commit and pushInstall
npm install -g readme-diagramCurrently there is an issue with installing electron. If you run across issue Error: EACCES: permission denied, mkdir '<...>readme-diagram/node_modules/electron/.electron' try to install package with command: npm install -g readme-diagram --unsafe-perm=true --allow-root
Usage
In readme file place image holder:
Then after that place a code block with language corresponding to code-name of diagram:
```js-sequence-diagram
Alice->Bob: Hello Bob, how are you?
Note right of Bob: Bob thinks
Bob-->Alice: I am good thanks!
```To hide this code block put it into details:
<details><summary>raw</summary>
...
</details>Run generator:
readme-diagram --file my-readme.mdGenerator will create diagrams and save them in path from image holder (in this example relative/path/to/file.svg which is relative to readme file).
Supported diagrams and code-names
This tool supports diagrams from https://github.com/francoislaberge/diagrams
| diagram type | code-name |
|---|---|
| flowchart | js-flowchart-diagram |
| sequence | js-sequence-diagram |
| dot | js-dot-diagram |
| railroad | js-railroad-diagram |