Skip to content

Commit

Permalink
feat: update guide doc
Browse files Browse the repository at this point in the history
  • Loading branch information
@ipetinate
ipetinate committed Jun 21, 2024
1 parent 7b03e13 commit d0f759d
Showing 1 changed file with 25 additions and 53 deletions.
78 changes: 25 additions & 53 deletions src/templates/core/SCAFFOLD_GUIDE.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,12 @@
This documentation describes how to use the `meta.yaml` file to create local resources based on templates found in the `.clingon/templates` folder.

If you don't know how to create YAML or custom local template files, I recommend that you run the initialization command with the `--examples` flag, which will do all the local configuration necessary for the project to work, in addition to adding some ready-made files. example so you can use it.

```shell
npx clingon init --examples
```

## Structure of the `meta.yaml` File

The `meta.yaml` file contains definitions of resources that the CLI tool uses to generate components, pages, async functions, or whatever you want.
Expand All @@ -12,19 +18,13 @@ The `meta.yaml` file contains definitions of resources that the CLI tool uses to

The table below describes the fields used in the resource definitions in the `meta.yaml` file.

| Field | Type | Required | Description |
| ----------------------- | ------- | ------------------------ | --------------------------------------------------------------------- |
| `identifier` | string | Yes | Unique identifier for the resource. |
| `folderWrapper` | boolean | No | Indicates if the resource should be wrapped by a folder. |
| `resource` | object | Yes | Contains information about the main resource. |
| `resource.target` | string | Yes | Target directory where the resource will be generated. |
| `resource.templatePath` | string | Yes | Path to the resource template. |
| `test` | object | No | Contains information about the resource's test file. |
| `test.target` | string | Yes (if `test` present) | Target directory where the test will be generated. |
| `test.templatePath` | string | Yes (if `test` present) | Path to the test template. |
| `story` | object | No | Contains information about the resource's story file (for Storybook). |
| `story.target` | string | Yes (if `story` present) | Target directory where the story will be generated. |
| `story.templatePath` | string | Yes (if `story` present) | Path to the story template. |
| Field | Type | Required | Description |
| ------------------- | ------- | -------- | --------------------------------------------------------------------------------------- |
| `identifier` | string | Yes | Unique identifier for the resource (used on `scaffold` flag `--template` as tag value). |
| `folderWrapper` | boolean | No | Indicates if the resource should be wrapped by a folder. |
| `resources` | object | Yes | List of resources to be created. |
| `resource.path` | string | Yes | Path target directory where the resource will be generated. |
| `resource.template` | string | Yes | Path to the resource template. |

## Detailed Examples

Expand All @@ -33,29 +33,19 @@ The table below describes the fields used in the resource definitions in the `me
```yaml
- identifier: component
folderWrapper: true
resource:
target: src/components
templatePath: ./ReactComponent/Component.tsx
test:
target: src/components
templatePath: ./ReactComponent/Component.spec.tsx
story:
target: src/components
templatePath: ./ReactComponent/Component.stories.tsx
resources:
- path: src/components
template: ./ReactComponent/index.tsx
- path: src/components
template: ./ReactComponent/Component.tsx
- path: src/components
tempalte: ./ReactComponent/Component.spec.tsx
- path: src/components
template: ./ReactComponent/Component.stories.tsx
- path: src/components
template: ./ReactComponent/Component.styles.css
```

- **identifier**: `component`
- **folderWrapper**: `true`
- **resource**:
- **target**: `src/components`
- **templatePath**: `./ReactComponent/Component.tsx`
- **test**:
- **target**: `src/components`
- **templatePath**: `./ReactComponent/Component.spec.tsx`
- **story**:
- **target**: `src/components`
- **templatePath**: `./ReactComponent/Component.stories.tsx`

### Asynchronous Function

```yaml
Expand All @@ -68,14 +58,6 @@ The table below describes the fields used in the resource definitions in the `me
templatePath: ./Functions/AsyncFunction.spec.ts
```

- **identifier**: `async-function`
- **resource**:
- **target**: `src/utils`
- **templatePath**: `./Functions/AsyncFunction.ts`
- **test**:
- **target**: `src/utils`
- **templatePath**: `./Functions/AsyncFunction.spec.ts`

### Markdown Documentation

```yaml
Expand All @@ -85,11 +67,6 @@ The table below describes the fields used in the resource definitions in the `me
templatePath: ./Docs/ReactHookDoc.md
```

- **identifier**: `markdown`
- **resource**:
- **target**: `src/docs`
- **templatePath**: `./Docs/ReactHookDoc.md`

### `.nvmrc` File

```yaml
Expand All @@ -99,18 +76,13 @@ The table below describes the fields used in the resource definitions in the `me
templatePath: ./Core/.nvmrc
```

- **identifier**: `nvmrc`
- **resource**:
- **target**: `.`
- **templatePath**: `./Core/.nvmrc`

## How to Use

1. Place the `meta.yaml` or `meta.json` (I strongly recommend using YAML, but you can use JSON) file in the `.clingon/templates` folder along with your templates.
2. Run the CLI tool according to your project's instructions to generate the resources defined in the `meta` file.

```shell
npx clingon scaffold <name> --template <templateName>
npx clingon scaffold <name> --template <templateIdentifier>
```

This structure allows for easy definition and generation of different types of resources in your project, ensuring consistency and organization.

0 comments on commit d0f759d

Please sign in to comment.