Update myTemplateGenerator to version 0.0.5. Introduced new configuration options, added support for additional case modifiers using the change-case-all package, and improved the webview for template selection and variable input. Updated package.json and package-lock.json accordingly. Added localization support for configuration settings and enhanced README with usage instructions.
This commit is contained in:
S.Gromov
271
README.md
271
README.md
@@ -1,211 +1,134 @@
|
||||
[English](#english) | [Русский](#русский)
|
||||
[🇬🇧 English](#mytemplategenerator) | [🇷🇺 Русский](#mytemplategenerator-русский)
|
||||
|
||||
---
|
||||
# MyTemplateGenerator
|
||||
|
||||
# English
|
||||
**Generate files and folders from templates with variable substitution right from the VS Code context menu.**
|
||||
|
||||
## My Template Generator — Template-based structure generation for VSCode
|
||||
- Syntax highlighting and autocomplete for template variables in template files (`{{name}}`, `{{name.camelCase}}`, etc.)
|
||||
- Instantly create project structure from templates with variables in file/folder names and content
|
||||
- Visual configurator and full localization (English/Russian)
|
||||
- Flexible settings: templates folder path, variable input mode, overwrite protection
|
||||
|
||||
|
||||
**Features:**
|
||||
- Syntax highlighting and autocomplete for template variables in templates
|
||||
- Generate files and folders from templates with variable substitution
|
||||
- Full localization (English/Russian) for all UI, messages, and menus
|
||||
- Choose variable input mode: Webview (form) or inputBox (one by one)
|
||||
- Overwrite control: allow or forbid overwriting existing files/folders
|
||||
- Smart conflict handling: clear notifications if structure already exists
|
||||
|
||||
Context menu "Create from template..." is available by right-clicking any folder.
|
||||
|
||||
|
||||
Convenient UI for creation: just select a template and specify values for the variables used in the template. (The list of variables updates automatically)
|
||||
|
||||
|
||||
User-friendly settings UI.
|
||||
|
||||
**How to use:**
|
||||
1. Create a folder with templates (default: `templates`).
|
||||
2. Use variables in templates: `{{name}}`, `{{name.pascalCase}}`, etc.
|
||||
3. Right-click any folder in your project → **Create from template...**
|
||||
4. Select a template, fill in variables — the structure is generated automatically.
|
||||
|
||||
### Quick Start
|
||||
1. Create a `templates` folder in your project root.
|
||||
2. Add subfolders for different templates (e.g., `components`, `store`).
|
||||
3. Use variables like `{{name}}` or `{{name.pascalCase}}` in file/folder names and file contents.
|
||||
4. Right-click a folder in VSCode and select **Create from template...**
|
||||
5. Choose a template, fill in variables, and click "Create".
|
||||
|
||||
### Example template structure
|
||||
**Example template:**
|
||||
```
|
||||
templates/
|
||||
components/
|
||||
component/
|
||||
{{name}}/
|
||||
index.js
|
||||
style.module.css
|
||||
store/
|
||||
{{name}}Store.js
|
||||
index.tsx
|
||||
{{name.camelCase}}.module.css
|
||||
```
|
||||
|
||||
### Supported variables and modifiers
|
||||
**Available modifiers:**
|
||||
|
||||
You can use variables with modifiers via dot notation:
|
||||
| Modifier | Example (`name = myComponent`) |
|
||||
|-----------------------|-------------------------------|
|
||||
| `{{name}}` | myComponent |
|
||||
| `{{name.pascalCase}}` | MyComponent |
|
||||
| `{{name.camelCase}}` | myComponent |
|
||||
| `{{name.snakeCase}}` | my_component |
|
||||
| `{{name.kebabCase}}` | my-component |
|
||||
| `{{name.screamingSnakeCase}}` | MY_COMPONENT |
|
||||
| `{{name.upperCase}}` | Mycomponent |
|
||||
| `{{name.lowerCase}}` | mycomponent |
|
||||
| `{{name.upperCaseAll}}` | MYCOMPONENT |
|
||||
| `{{name.lowerCaseAll}}` | mycomponent |
|
||||
|
||||
- `{{name}}` — as entered by user
|
||||
- `{{name.pascalCase}}` — PascalCase
|
||||
- `{{name.camelCase}}` — camelCase
|
||||
- `{{name.snakeCase}}` — snake_case
|
||||
- `{{name.kebabCase}}` — kebab-case
|
||||
- `{{name.screamingSnakeCase}}` — SCREAMING_SNAKE_CASE
|
||||
- `{{name.upperCase}}` — First letter uppercase
|
||||
- `{{name.lowerCase}}` — all lowercase
|
||||
- `{{name.upperCaseAll}}` — ALLUPPERCASE (no separators)
|
||||
- `{{name.lowerCaseAll}}` — alllowercase (no separators)
|
||||
**Supported modifiers:** pascalCase, camelCase, snakeCase, kebabCase, upperCase, lowerCase, and more.
|
||||
|
||||
> When searching for variables for the form, only the name before the dot is considered. For example, `{{name}}` and `{{name.pascalCase}}` are the same variable.
|
||||
**Framework compatibility:**
|
||||
|
||||
### Example usage in template
|
||||
```
|
||||
components/
|
||||
{{name.pascalCase}}/
|
||||
index.js
|
||||
{{name.camelCase}}.service.js
|
||||
{{name.snakeCase}}.test.js
|
||||
```
|
||||
And in file contents:
|
||||
```
|
||||
export class {{name.pascalCase}} {}
|
||||
const name = '{{name}}';
|
||||
```
|
||||
This extension works with **any framework** — you define your own templates for any structure you need!
|
||||
|
||||
### Configuration
|
||||
**To open the visual configurator, press <kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>P</kbd>, type `Configure myTemplateGenerator...` and select the command.**
|
||||
| Framework | Components | Store/State | Pages/Routes | Services | Utils |
|
||||
|--------------|:----------:|:-----------:|:------------:|:--------:|:-----:|
|
||||
| React | ✅ | ✅ | ✅ | ✅ | ✅ |
|
||||
| Vue | ✅ | ✅ | ✅ | ✅ | ✅ |
|
||||
| Angular | ✅ | ✅ | ✅ | ✅ | ✅ |
|
||||
| Svelte | ✅ | ✅ | ✅ | ✅ | ✅ |
|
||||
| Next.js | ✅ | ✅ | ✅ | ✅ | ✅ |
|
||||
| Nuxt | ✅ | ✅ | ✅ | ✅ | ✅ |
|
||||
| Solid | ✅ | ✅ | ✅ | ✅ | ✅ |
|
||||
| Vanilla JS/TS| ✅ | ✅ | ✅ | ✅ | ✅ |
|
||||
|
||||
Use `mytemplategenerator.json` in your project root or the visual configurator (**Configure myTemplateGenerator...**):
|
||||
```json
|
||||
{
|
||||
"templatesPath": "templates",
|
||||
"overwriteFiles": false,
|
||||
"inputMode": "webview", // or "inputBox"
|
||||
"language": "en" // or "ru"
|
||||
}
|
||||
```
|
||||
- **templatesPath** — path to templates folder
|
||||
- **overwriteFiles** — allow or forbid overwriting existing files/folders
|
||||
- **inputMode** — variable input mode: "webview" (form) or "inputBox" (one by one)
|
||||
- **language** — plugin UI language (en/ru)
|
||||
Just create a template for your favorite stack — and generate any structure you want! 🎉
|
||||
|
||||
### Localization
|
||||
- All UI, messages, errors, and menus are localized.
|
||||
- Webview and messages use the language from config.
|
||||
- Menu/command language depends on VSCode interface language.
|
||||
**Configuration:**
|
||||
All settings via `mycodegenerate.json` in the project root or the visual configurator.
|
||||
|
||||
### Key commands
|
||||
- **Create from template...** — generate structure (context menu)
|
||||
- **Configure myTemplateGenerator...** — open visual configurator (command palette)
|
||||
|
||||
### Error handling & overwrite
|
||||
- If structure or file exists and overwrite is forbidden, generation is cancelled and a clear notification is shown.
|
||||
- Any file creation error stops generation and shows the reason.
|
||||
|
||||
---
|
||||
|
||||
# Русский
|
||||
|
||||
## My Template Generator — Генерация структуры из шаблонов для VSCode
|
||||
|
||||
|
||||
**Возможности:**
|
||||
- Подсветка синтаксиса и автокомплит переменных в шаблонах
|
||||
- Генерация файлов и папок по шаблонам с подстановкой переменных
|
||||
- Полная локализация (русский/английский) для всего интерфейса, сообщений и меню
|
||||
- Выбор способа ввода переменных: Webview (форма) или inputBox (по одной)
|
||||
- Контроль перезаписи: можно запретить или разрешить перезапись существующих файлов/папок
|
||||
- Умная обработка конфликтов: понятные уведомления, если структура уже существует
|
||||
|
||||
Контекстное меню "Создать из шаблона.." доступно правым кликом по любой папке.
|
||||
|
||||
|
||||
Удобный UI создания, нужно только выбрать шаблок и указать значения переменных используемых в шаблоне. (Список переменных обновляется автоматически)
|
||||
|
||||
|
||||
Удобный UI интерфейс настроек.
|
||||
|
||||
To open the settings menu, press <kbd>Ctrl</kbd>+<kbd>P</kbd>, type `Configure myTemplateGenerator...` and select the menu item.
|
||||
|
||||
|
||||
### Быстрый старт
|
||||
1. В корне проекта создайте папку `templates`.
|
||||
2. Внутри неё создайте подпапки для разных шаблонов (например, `components`, `store`).
|
||||
3. Внутри шаблонов используйте переменные вида `{{name}}` или `{{name.pascalCase}}` в именах файлов/папок и в содержимом файлов.
|
||||
4. Кликните правой кнопкой мыши на нужной папке в VSCode и выберите пункт **Создать из шаблона...**
|
||||
5. В появившемся окне выберите шаблон, заполните переменные и нажмите "Создать".
|
||||
# MyTemplateGenerator (русский)
|
||||
|
||||
### Пример структуры шаблонов
|
||||
**Генерация файлов и папок по шаблонам с автозаменой переменных прямо из контекстного меню VS Code.**
|
||||
|
||||
- Подсветка и автокомплит переменных в шаблонных файлах (`{{name}}`, `{{name.camelCase}}` и др.)
|
||||
- Быстрое создание структуры проекта по шаблонам с подстановкой переменных в имена файлов, папок и содержимое
|
||||
- Визуальный конфигуратор и поддержка локализации (русский/английский)
|
||||
- Гибкая настройка: путь к шаблонам, режим ввода переменных, запрет/разрешение перезаписи файлов
|
||||
|
||||
|
||||
|
||||
|
||||
**Как использовать:**
|
||||
1. Создайте папку с шаблонами (по умолчанию `templates`).
|
||||
2. Используйте переменные в шаблонах: `{{name}}`, `{{name.pascalCase}}` и т.д.
|
||||
3. Кликните правой кнопкой по папке в проекте → **Создать из шаблона...**
|
||||
4. Выберите шаблон, заполните переменные — структура будет создана автоматически.
|
||||
|
||||
**Пример шаблона:**
|
||||
```
|
||||
templates/
|
||||
components/
|
||||
component/
|
||||
{{name}}/
|
||||
index.js
|
||||
style.module.css
|
||||
store/
|
||||
{{name}}Store.js
|
||||
index.tsx
|
||||
{{name.camelCase}}.module.css
|
||||
```
|
||||
|
||||
### Переменные и модификаторы
|
||||
**Доступные модификаторы:**
|
||||
|
||||
В шаблонах можно использовать переменные с модификаторами через точку:
|
||||
| Модификатор | Пример (`name = myComponent`) |
|
||||
|----------------------|-------------------------------|
|
||||
| `{{name}}` | myComponent |
|
||||
| `{{name.pascalCase}}`| MyComponent |
|
||||
| `{{name.camelCase}}` | myComponent |
|
||||
| `{{name.snakeCase}}` | my_component |
|
||||
| `{{name.kebabCase}}` | my-component |
|
||||
| `{{name.screamingSnakeCase}}` | MY_COMPONENT |
|
||||
| `{{name.upperCase}}` | Mycomponent |
|
||||
| `{{name.lowerCase}}` | mycomponent |
|
||||
| `{{name.upperCaseAll}}` | MYCOMPONENT |
|
||||
| `{{name.lowerCaseAll}}` | mycomponent |
|
||||
|
||||
- `{{name}}` — как ввёл пользователь
|
||||
- `{{name.pascalCase}}` — PascalCase
|
||||
- `{{name.camelCase}}` — camelCase
|
||||
- `{{name.snakeCase}}` — snake_case
|
||||
- `{{name.kebabCase}}` — kebab-case
|
||||
- `{{name.screamingSnakeCase}}` — SCREAMING_SNAKE_CASE
|
||||
- `{{name.upperCase}}` — Первая буква большая
|
||||
- `{{name.lowerCase}}` — все буквы маленькие
|
||||
- `{{name.upperCaseAll}}` — ВСЕ БУКВЫ БОЛЬШИЕ (без разделителей)
|
||||
- `{{name.lowerCaseAll}}` — все буквы маленькие (без разделителей)
|
||||
**Поддерживаемые модификаторы:** pascalCase, camelCase, snakeCase, kebabCase, upperCase, lowerCase и др.
|
||||
|
||||
> При поиске переменных для формы учитывается только имя до точки. Например, `{{name}}` и `{{name.pascalCase}}` — это одна переменная.
|
||||
**Совместимость с фреймворками:**
|
||||
|
||||
### Пример использования в шаблоне
|
||||
```
|
||||
components/
|
||||
{{name.pascalCase}}/
|
||||
index.js
|
||||
{{name.camelCase}}.service.js
|
||||
{{name.snakeCase}}.test.js
|
||||
```
|
||||
Внутри файлов также можно использовать эти переменные:
|
||||
```
|
||||
export class {{name.pascalCase}} {}
|
||||
const name = '{{name}}';
|
||||
```
|
||||
Плагин подходит для **любых фреймворков** — вы сами задаёте шаблоны для любой структуры!
|
||||
|
||||
### Конфигурация
|
||||
**Чтобы открыть визуальный конфигуратор, нажмите <kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>P</kbd>, введите `Настроить myTemplateGenerator...` и выберите команду.**
|
||||
| Фреймворк | Компоненты | Store/State | Страницы/Роуты | Сервисы | Утилиты |
|
||||
|--------------|:----------:|:-----------:|:--------------:|:-------:|:-------:|
|
||||
| React | ✅ | ✅ | ✅ | ✅ | ✅ |
|
||||
| Vue | ✅ | ✅ | ✅ | ✅ | ✅ |
|
||||
| Angular | ✅ | ✅ | ✅ | ✅ | ✅ |
|
||||
| Svelte | ✅ | ✅ | ✅ | ✅ | ✅ |
|
||||
| Next.js | ✅ | ✅ | ✅ | ✅ | ✅ |
|
||||
| Nuxt | ✅ | ✅ | ✅ | ✅ | ✅ |
|
||||
| Solid | ✅ | ✅ | ✅ | ✅ | ✅ |
|
||||
| Vanilla JS/TS| ✅ | ✅ | ✅ | ✅ | ✅ |
|
||||
|
||||
Для гибкой настройки используйте файл `mytemplategenerator.json` в корне проекта или визуальный конфигуратор (команда **Настроить myTemplateGenerator...**):
|
||||
Создайте шаблон под свой стек — и генерируйте любые структуры! 🎉
|
||||
|
||||
```json
|
||||
{
|
||||
"templatesPath": "templates",
|
||||
"overwriteFiles": false,
|
||||
"inputMode": "webview", // или "inputBox"
|
||||
"language": "ru" // или "en"
|
||||
}
|
||||
```
|
||||
- **templatesPath** — путь к папке с шаблонами
|
||||
- **overwriteFiles** — разрешать ли перезапись существующих файлов/папок
|
||||
- **inputMode** — способ ввода переменных: "webview" (форма) или "inputBox" (по одной)
|
||||
- **language** — язык интерфейса плагина (ru/en)
|
||||
**Настройка:**
|
||||
Всё настраивается через файл `mycodegenerate.json` в корне проекта или визуальный конфигуратор.
|
||||
|
||||
### Локализация
|
||||
- Все сообщения, Webview, ошибки и пункты меню локализованы.
|
||||
- Язык Webview и сообщений выбирается в конфигураторе.
|
||||
- Язык пунктов меню и команд зависит от языка интерфейса VSCode.
|
||||
|
||||
### Важные команды
|
||||
- **Создать из шаблона...** — генерация структуры (контекстное меню)
|
||||
- **Настроить myTemplateGenerator...** — открыть визуальный конфигуратор (палитра команд)
|
||||
|
||||
### Обработка ошибок и перезаписи
|
||||
- Если структура или файл уже существуют и перезапись запрещена, генерация не выполняется и выводится понятное уведомление.
|
||||
- Если при создании любого файла возникает ошибка — генерация полностью прекращается, и пользователь видит причину.
|
||||
|
||||
---
|
||||
Чтобы открыть меню настроек, нажмите <kbd>Ctrl</kbd>+<kbd>P</kbd>, введите `Настроить myTemplateGenerator...` (или `Configure myTemplateGenerator...` для английского интерфейса) и выберите соответствующий пункт.
|
||||
|
||||
Reference in New Issue
Block a user