Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/alkamin/indigo
Create a chakra-ui based React component library with one command
https://github.com/alkamin/indigo
chakra-ui cli component-library github-package-registry oclif react semantic-release storybook typesript
Last synced: about 1 month ago
JSON representation
Create a chakra-ui based React component library with one command
- Host: GitHub
- URL: https://github.com/alkamin/indigo
- Owner: alkamin
- Created: 2021-02-09T01:51:57.000Z (almost 4 years ago)
- Default Branch: master
- Last Pushed: 2021-08-20T13:27:44.000Z (over 3 years ago)
- Last Synced: 2024-12-09T21:20:03.532Z (about 2 months ago)
- Topics: chakra-ui, cli, component-library, github-package-registry, oclif, react, semantic-release, storybook, typesript
- Language: TypeScript
- Homepage:
- Size: 314 KB
- Stars: 1
- Watchers: 2
- Forks: 0
- Open Issues: 13
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
Awesome Lists containing this project
README
# indigo
Create a chakra-ui based application component library with one command
[](https://oclif.io)
[](https://github.com/semantic-release/semantic-release)
[](https://www.npmjs.com/package/@alkamin/indigo)
[](https://www.npmjs.com/package/@alkamin/indigo)
[](https://github.com/alkamin/indigo/blob/master/package.json)
Libaries created with Indigo are pre-configured with:
- GitHub actions based build process with [semantic-release](https://github.com/semantic-release/semantic-release) and automated changelog generation and publishing to the GitHub Package Repository (GPR) or NPM
- TypeScript
- Storybook
## Getting started
Indigo works with node versions < v15. We encourage using [`nvm`](https://github.com/nvm-sh/nvm) to easily manage your node versions.
If you're using `nvm` you can ensure you're on the right version with `nvm use 14`.
```
$ npx @alkamin/indigo new my-component-library
$ cd my-component-library
$ npm start
```
## CI/CD Configuration
Defining a repository secret named `RELEASE_PAT` is required for the semantic release workflow. The user who owns the token will be listed as the creator of all releases triggered by the semantic release GitHub action.
### Publishing to NPM
If you choose NPM as your publishing method, you will need to provide an NPM token (`NPM_TOKEN`) to the build process:
- generate an NPM access token -- [NPM provides helpful guidance](https://docs.npmjs.com/creating-and-viewing-access-tokens)
- in your UI library's repository, create a secret named `NPM_TOKEN` and set the value to the token you created in the previous step
## Changing the commit message format
By default, Indigo configures semantic-release to use the `conventionalcommits` preset. Read more about [conventional commits](https://www.conventionalcommits.org/en/v1.0.0/)
You can alter the `preset` setting of the `@semantic-release/commit-analyzer` and `@semantic-release/release-notes-generator` plugins in your library's `package.json` file. Read more about [configuring the commit message format](https://github.com/semantic-release/semantic-release/blob/master/README.md#commit-message-format)
## Changing the changelog file
By default, Indigo configures the build process to generate a `CHANGELOG.md` file. If you'd like to use a different name for the changelog file alter the configuration of the `@semantic-release/changelog` and `@semantic-release/git` plugins in your library's `package.json` file.
* [indigo](#indigo)
## CLI usage
```sh-session
$ npm install -g @alkamin/indigo
$ indigo COMMAND
running command...
$ indigo (-v|--version|version)
@alkamin/indigo/1.6.2 linux-x64 node-v12.22.5
$ indigo --help [COMMAND]
USAGE
$ indigo COMMAND
...
```
## Commands
* [`indigo generate COMPONENTNAME`](#indigo-generate-componentname)
* [`indigo help [COMMAND]`](#indigo-help-command)
* [`indigo new PACKAGENAME`](#indigo-new-packagename)
## `indigo generate COMPONENTNAME`
Scaffold a new component
```
USAGE
$ indigo generate COMPONENTNAME
ARGUMENTS
COMPONENTNAME the name of the component you want to generate
OPTIONS
-h, --help show CLI help
--skipStory
```
_See code: [src/commands/generate/index.ts](https://github.com/alkamin/indigo/blob/v1.6.2/src/commands/generate/index.ts)_
## `indigo help [COMMAND]`
display help for indigo
```
USAGE
$ indigo help [COMMAND]
ARGUMENTS
COMMAND command to show help for
OPTIONS
--all see all commands in CLI
```
_See code: [@oclif/plugin-help](https://github.com/oclif/plugin-help/blob/v3.2.2/src/commands/help.ts)_
## `indigo new PACKAGENAME`
Scaffold a new UI library
```
USAGE
$ indigo new PACKAGENAME
ARGUMENTS
PACKAGENAME the name of the package you want to generate
OPTIONS
-h, --help show CLI help
--useNpm
```
_See code: [src/commands/new/index.ts](https://github.com/alkamin/indigo/blob/v1.6.2/src/commands/new/index.ts)_