arredemo
Version:
Instantly build a static site for your package
149 lines (79 loc) • 3.56 kB
Markdown
# arredemo
[](https://www.npmjs.com/package/arredemo)
[](https://www.npmjs.com/package/arredemo)
---
> **arre demo!**
> Véxase **[arre](https://academia.gal/dicionario/-/termo/arre)**. Interxección:
> **1** Voz para facer andar as cabalarías.
> _Arre, faco!_
> Véxase **[demo](https://academia.gal/dicionario/-/termo/demo)**. Substantivo masculino:
> **1** Ser imaxinario que representa o mal na tradición popular.
> _O demo anda sempre tentando a xente._
---
# Intro
[`arredemo`](https://www.afialapis.com/os/arredemo) will instantly build a static site for your package, containing:
- *Docs* page, made from your repo's `README.md`
- *Demo* page, made from your demo component (who hasn't a `/demo` folder, huh?)
For example, [`arredemo` site](https://www.afialapis.com/os/arredemo/) itself has been built with `arredemo`.
# Install
```
npm i [-D] arredemo
```
Optionally, you can install `arredemo` globally. It works too!
```
npm i -g arredemo
```
# Build your site
This single command will do the magic:
```
npx arredemo build
```
The first time you launch it, the `arredemo.json` file will be created. You can then tweak it manually for further builds.
An `arredemo` folder will be made, containing the static site. You may want your web server to point to `arredemo/index.html`!
# Site content
## Docs
The docs page will be made from your repo's `README.md` file.
Notice you can include several versions of your package to be documented, not just the current one.
## Demo
### ES Modules
They are the future, so just ESM are allowed.
# Configuration options
The `arredemo.json` file will contain `arredemo`'s configuration. It is created he first time you run the build.
## UI options
### `theme`
Right now, just `default` theme is available. Other themes will be (hopefully) added in the future!
### `favicon`
Path to your [FavIcon](https://www.w3schools.com/html/html_favicon.asp) file.
### `logo`
Path to your logo file. It'll be shown in the site's header.
### `url`, `company` and `company_url`
Shown in the site's Footer.
## Docs
### `doc_versions`
Optional array of values of the versions of your package you want to show Docs for.
Current version (repo time, not necessarily published yet) will be taken by default.
### `md.strip_details_tag` and `md.keep_summary_content`
Sometimes, for the shake of a better visualization in your repo's GitHub page, you will make use of this HTML tags:
```py
<details>
<summary>
Some title for a toggler
</summary>
A lot of lines
Which are toggled off
So my GitHub's page is not giant
But at the same time my sensible content remains there
</details>
```
If `md.strip_details_tag` is `true` (the default), `arredemo` will strip out this HTML tags, leaving the inner text.
But, depending on how your use it, you may want to keep the content inside ```\<summary\>\<\/summary\>``` or not. Use
`md.keep_summary_content: true` in order to do it (it defaults to `false`).
## Demo
### `demo_entry`
Path to your demo index file.
This file will make a `export default` of your React component.
Yes: in the future this will be done better and non-React stuff will be compatible too.
If `demo_entry: null`, no Demo page will be built.
# Changelog
See [changelog here](https://github.com/afialapis/arredemo/blob/main/CHANGELOG.md)