https://github.com/miyagi-dev/vscode-miyagi

VS Code extension for miyagi.
https://github.com/miyagi-dev/vscode-miyagi

miyagi vscode vscode-extension

Last synced: 5 days ago
JSON representation

VS Code extension for miyagi.

• Host: GitHub
• URL: https://github.com/miyagi-dev/vscode-miyagi
• Owner: miyagi-dev
• License: mit
• Created: 2022-07-11T20:30:54.000Z (over 2 years ago)
• Default Branch: main
• Last Pushed: 2024-04-08T18:01:22.000Z (7 months ago)
• Last Synced: 2024-04-08T20:13:40.746Z (7 months ago)
• Topics: miyagi, vscode, vscode-extension
• Language: TypeScript
• Homepage: https://marketplace.visualstudio.com/items?itemName=fynn.miyagi
• Size: 1.48 MB
• Stars: 2
• Watchers: 1
• Forks: 1
• Open Issues: 5
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • Contributing: CONTRIBUTING.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# miyagi for VS Code

Please refer to the [miyagi docs](https://www.miyagi.dev/) for setting up and configuring a miyagi project.

> [!TIP]

> The extension is only activated if a [miyagi configuration file](https://docs.miyagi.dev/configuration/config-file/) is found when a workspace is opened.

>

> When first setting up a new miyagi project, reload the VS Code window _after_ creating the configuration file and installing dependencies.

## Features

- [Create components](#create-components)

- [Lint components](#lint-components)

- [Generate mocks](#generate-mocks)

- [File links](#file-links)

  - [Schema and mock links](#schema-and-mock-links)

  - [Template links](#template-links)

- [Code completion](#code-completion)

  - [Template completion](#template-completion)

- [Command palette](#command-palette)

## Create components

Create new components by right-clicking on any folder inside your components folder and selecting “miyagi ➝ New Component”.



## Lint components

Lint components by right-clicking any component folder and selecting “miyagi ➝ Lint Component”.



## Generate mocks

Create automatic dummy mock data by right-clicking any component folder and selecting “miyagi ➝ Generate Mocks”.



## File links

### Schema and mock links

Linked [`$ref`](https://docs.miyagi.dev/how-to/writing-mock-data/#referencing-other-mock-files) and [`$tpl`](https://docs.miyagi.dev/how-to/writing-mock-data/#referencing-template-files) file references in mocks and schemas.



### Template links

(Twig-only)

Linked template file references in [Twig templates](https://twig.symfony.com/).



## Code completion

### Template completion

(Twig-only)

Properties from schemas are provided as autocomplete items for [IntelliSense](https://code.visualstudio.com/docs/editor/intellisense).

The trigger characters `|` (all types) and `.` (only object and array types) can be used to confirm an item and automatically insert the trigger character. The `|` is used to chain [Twig filters](https://twig.symfony.com/doc/3.x/templates.html#filters). The `.` is used to access [Twig object keys or array indexes](https://twig.symfony.com/doc/3.x/templates.html#variables).



## Command palette

These global commands are accessible in the command palette:

| Command             | Description                                         |

| ------------------- | --------------------------------------------------- |

| New Component       | Create a new component by manually entering a path. |

| Lint All Components | Lint the entire miyagi project.                     |

| Reload              | Manually trigger a miyagi config reload.            |

**Note:** The extension automatically reloads when the miyagi config changes. Only use the “Reload” command if the extension stops working.



## Sponsors