> ## Documentation Index
> Fetch the complete documentation index at: https://docs.stylebit.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Quickstart

**Stylebit CLI tool** is designed to analyze design system adoption in codebase.
It will crawl the codebase and will try to find all the places where the design system is used and calculate adoption rate.

* Supports `React/Typescript` for components as well as `scss/css` for design tokens.
* Support `React Native`.
* Supports `WebComponents` (alpha).

## installation

<CodeGroup>
  ```bash npm
  npm install -g @stylebit/cli
  ```

  ```bash yarn
  yarn global add @stylebit/cli
  ```
</CodeGroup>

### Get access token

```bash
stylebit login
```

### Run locally

<CodeGroup>
  ```bash run locally
  stylebit run --config=./stylebit.config.json --dry-run
  ```

  ```bash publish
  stylebit run --config=./stylebit.config.json
  ```
</CodeGroup>

**NOTE:** `--config` option is required

## Manual

<AccordionGroup>
  <Accordion title="usage: stylebit [options] [command]">
    ```bash
    A CLI tool to analyze design system adoption in a codebase

    Options:
      -V, --version   output the version number
      -v, --verbose   Enable verbose mode
      -h, --help      display help for command

    Commands:
      login           Login to Stylebit
      run [options]   Run design system analytics
      help [command]  display help for command
    ```
  </Accordion>

  <Accordion title="usage: stylebit run [options]">
    ```bash
    Run design system analytics

    Options:
    -c, --config <filePath>   Path to the configuration file stylebit.config.json. If not provided, the tool will look for it in the current directory
    --dry-run                 Run the analysis without sending the results to Stylebit
    --o, --output <filePath>  Path to the output file. Only available for --dry-run mode, if not provided, the tool will write the results to the
                              stylebit.report.json file in the current directory
    -h, --help                display help for command
    ```
  </Accordion>

  <Accordion title="config file options">
    * **crawlFrom**: string - path to the directory to start crawling from (required). The directory there the UI components are located, FE code is located, etc.
    * **componentRoot**: string - path to the directory where the you UI library components are located (use either this or `packageName`)
    * **packageName**: string - name of the package where the you UI library components are located (use either this or `componentRoot`)
    * **outputFile**: string - path to the output file. Only available for --dry-run mode, if not provided, the tool will log to the console
    * **projectId**: string - You can get `projectId` by creating a project in [http://app.stylebit.io](http://app.stylebit.io). For `--dry-run` mode `projectId` in NOT required.
    * **tag**: string - You can optionally tag your scan or series of scans.
    * **ignore** Array\[string] - You can optionally specify glob pattern to ignore paths for files from being scanned. If the field is not specified the it results to the following default:

    ```
    [
        "node_modules",
        "dist",
        "build",
        "tests",
        "test",
        "**/.*",
        "**/*.{test,spec}.{jsx,tsx,js,ts}",
        "**/*.stories.{jsx,tsx,js,ts}",
        "**/*.d.ts"
    ]
    ```

    * **scss**: boolean - specifying the field `true` will track design tokens in `scss` and `css` files.
    * **css**: boolean - specifying the field `true` will track design tokens in `css` files.
  </Accordion>

  <Accordion title="sample configs">
    ```json sample 1
    {
      "crawlFrom": "./packages/stylebit/src",
      "componentRoot": "./packages/stylebit/src/components",
      "outputFile": "./stylebit.report.json",
      "projectId": "abcdefgh-0123-4567-89ij-klmnopqrstuv",
      "scss": true
    }
    ```

    ```json sample 2
    {
      "crawlFrom": "./packages/stylebit/src",
      "packageName": "@components",
      "projectId": "abcdefgh-0123-4567-89ij-klmnopqrstuv",
      "tag": "ci/cd",
      "ignore": ["node_modules", "**/.*", "**/*.test.ts", "**/*.d.ts"]
    }
    ```
  </Accordion>
</AccordionGroup>

## Troubleshooting

<Info>It's recommended to install stylebit cli globally. Make sure you have it installed globally before moving forward. </Info>

* If you select technology but nothing happens make sure you provide correct config.json path. To see exact message run in `--verbose` mode
* If you see an error <Warning> ENOENT: no such file or directory, open '\$Home/.stylebit/credentials' </Warning>make sure you are logged in. `stylebit login` will navigate you to the browser. Log in there and you will get your credentials for the cli. If you were logged in, probably your token has expired. Try to login again.

<CardGroup cols={2}>
  <Card title="How to ignore files" icon="square-1" href="https://docs.stylebit.io/globpattern">
    Check out how to use glob pattern
  </Card>

  <Card title="Limitations" icon="square-2" href="https://docs.stylebit.io/limitations">
    Checkout out technical requirements
  </Card>
</CardGroup>