Skip to content

Commit

Permalink
doc add output flag and some reorganization for #202
Browse files Browse the repository at this point in the history
  • Loading branch information
rrd108 committed Sep 3, 2024
1 parent 75e802d commit fe072c2
Show file tree
Hide file tree
Showing 2 changed files with 33 additions and 96 deletions.
63 changes: 16 additions & 47 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -72,59 +72,25 @@ bunx jsr add @rrd/vue-mess-detector --dev

## ⚙️ Usage

If you want to analyze your full project directory.
Basic usage:

```bash
npx vue-mess-detector analyze
npx vue-mess-detector analyze [path]
```

If you want to analyze only your `src/components` directory.
Options:

```bash
npx vue-mess-detector analyze ./src/components
```
| Option | Description | Default | Example |
| ----------- | ------------------------------------------------------- | ------- | ------------------------------------------------------ |
| `[path]` | Specify directory or file to analyze | `./src` | `./src/components/AppHeader.vue` |
| `--exclude` | Exclude directories or files (comma-separated) | None | `--exclude=components,Gauranga.vue` |
| `--apply` | Apply **only** specific rulesets or rules (comma-separated) | All rules | `--apply=vue-essential,magicNumbers` |
| `--ignore` | Ignore **only** specific rulesets or rules (comma-separated) | - | `--ignore=vue-caution,functionSize` |
| `--group` | Group results by `file` or `rule` | `rule` | `--group=file` |
| `--order` | Order results (`asc` or `desc`) | `asc` | `--order=desc` |
| `--level` | Show only specific level (`error` or `warning`) | Both | `--level=error` |
| `--output` | Output format `text` or `table` or `json` | `text` | `--output=table` |

If you want to analyze only your `src/components/AppHeader.vue` file.

```bash
npx vue-mess-detector analyze ./src/components/AppHeader.vue
```

If you want to exclude some directories add the `--exclude` flag with comma separated list of directories and files to exclude.

```bash
npx vue-mess-detector analyze ./src --exclude=components,Gauranga.vue
```

If you want to ignore *some* rulesets or rules add the `--ignore` flag with comma separated list of rulesets/rules to ignore.

```bash
npx vue-mess-detector analyze ./src --ignore=vue-caution,functionSize
```

If you want to apply *only* some rulesets or rules add the `--apply` flag with comma separated list of rulesets/rules to apply.

```bash
npx vue-mess-detector analyze ./src --apply=vue-essential,vue-strong,magicNumbers
```

If you want to *group* the results by file add the `--group` flag with one of the allowed options `file | rule`

```bash
npx vue-mess-detector analyze ./src --group=file
```

If you want to *order* the results by the most problematic file add the `--order` flag with `desc`

```bash
npx vue-mess-detector analyze ./src --group=file --order=desc
```

If you want to see only *errors* add the `--level` flag with `error`

```bash
npx vue-mess-detector analyze ./src --group=file --level=error
```

If you want to store your flags in a configuration file, you can create a `vue-mess-detector.json` file in the root of your project with the following content:

Expand All @@ -146,9 +112,11 @@ All flags will be read from the configuration file. All missing flags will be se
## 📊 Example output

#### Without `--group` flag (default behavior is to group per rule) ⬇️

![Output Image - Group By Rule](./docs/public/results-per-rule.png)

#### With `--group=file` flag ⬇️

![Output Image - Group By File](./docs/public/results-per-file.png)

## 🧾 Output explanation
Expand All @@ -172,6 +140,7 @@ All flags will be read from the configuration file. All missing flags will be se
According to the number of errors and warnings, and the lines of code in your project, we calculate a health score for your project.

The code health is:

- **low** if the score is under 75%
- **medium** if the score is between 75% and 85%
- **ok** if the score is between 86% and 95%
Expand Down
66 changes: 17 additions & 49 deletions docs/get-started.md
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
# Getting Started
# Getting Started

Check your Vue and Nuxt projects for code smells and best practice violations with Vue Mess Detector.

Expand Down Expand Up @@ -68,59 +68,24 @@ bunx jsr add @rrd/vue-mess-detector --dev

## ⚙️ Usage

If you want to analyze your full project directory.
Basic usage:

```bash
npx vue-mess-detector analyze
```

If you want to analyze only your `src/components` directory.

```bash
npx vue-mess-detector analyze ./src/components
```

If you want to analyze only your `src/components/AppHeader.vue` file.

```bash
npx vue-mess-detector analyze ./src/components/AppHeader.vue
```

If you want to exclude some directories add the `--exclude` flag with comma separated list of directories and files to exclude.

```bash
npx vue-mess-detector analyze ./src --exclude=components,Gauranga.vue
```

If you want to ignore *some* rulesets or rules add the `--ignore` flag with comma separated list of rulesets/rules to ignore.

```bash
npx vue-mess-detector analyze ./src --ignore=vue-caution,functionSize
npx vue-mess-detector analyze [path]
```

If you want to apply *only* some rulesets or rules add the `--apply` flag with comma separated list of rulesets/rules to apply.
Options:

```bash
npx vue-mess-detector analyze ./src --apply=vue-essential,vue-strong,magicNumbers
```

If you want to *group* the results by file add the `--group` flag with one of the allowed options `file | rule`

```bash
npx vue-mess-detector analyze ./src --group=file
```

If you want to *order* the results by the most problematic file add the `--order` flag with `desc`

```bash
npx vue-mess-detector analyze ./src --group=file --order=desc
```

If you want to see only *errors* add the `--level` flag with `error`

```bash
npx vue-mess-detector analyze ./src --group=file --level=error
```
| Option | Description | Default | Example |
| ----------- | ------------------------------------------------------------ | --------- | ------------------------------------ |
| `[path]` | Specify directory or file to analyze | `./src` | `./src/components/AppHeader.vue` |
| `--exclude` | Exclude directories or files (comma-separated) | None | `--exclude=components,Gauranga.vue` |
| `--apply` | Apply **only** specific rulesets or rules (comma-separated) | All rules | `--apply=vue-essential,magicNumbers` |
| `--ignore` | Ignore **only** specific rulesets or rules (comma-separated) | - | `--ignore=vue-caution,functionSize` |
| `--group` | Group results by `file` or `rule` | `rule` | `--group=file` |
| `--order` | Order results (`asc` or `desc`) | `asc` | `--order=desc` |
| `--level` | Show only specific level (`error` or `warning`) | Both | `--level=error` |
| `--output` | Output format `text` or `table` or `json` | `text` | `--output=table` |

If you want to store your flags in a configuration file, you can create a `vue-mess-detector.json` file in the root of your project with the following content:

Expand All @@ -142,9 +107,11 @@ All flags will be read from the configuration file. All missing flags will be se
## 📊 Example output

#### Without `--group` flag (default behavior is to group per rule) ⬇️

![Output Image - Group By Rule](./public/results-per-rule.png)

#### With `--group=file` flag ⬇️

![Output Image - Group By File](./public/results-per-file.png)

## 🧾 Output explanation
Expand All @@ -167,6 +134,7 @@ All flags will be read from the configuration file. All missing flags will be se

According to the number of errors and warnings, and the lines of code in your project, we calculate a health score for your project.
The code health is:

- **low** if the score is under 75%
- **medium** if the score is between 75% and 85%
- **ok** if the score is between 86% and 95%
Expand Down

0 comments on commit fe072c2

Please sign in to comment.