- идентификатор расширения переименован с templateForge на templateFileGenerator - обновлены команды, настройки и конфигурация - обновлены ссылки на репозиторий - версия обновлена до 1.0.2 - обновлены локализации (en, ru) - обновлена документация (README, CHANGELOG)
2.8 KiB
2.8 KiB
Template File Generator
Расширение для VS Code. Генерирует файлы и папки из ваших шаблонов с подстановкой переменных.
Подсветка синтаксиса и автодополнение переменных прямо в файлах шаблонов.
Как работает
- Создайте папку
.templatesв корне проекта - Внутри -- каждая подпапка это шаблон
- Используйте переменные в именах файлов и содержимом:
{{name}}присутствует всегда, дополнительно можно использовать любое количество своих --{{author}},{{module}}и т.д. - ПКМ по папке в проводнике -- Создать из шаблона...
Расширение само найдёт все переменные в шаблоне и предложит заполнить каждую.
Пример
Структура шаблона:
.templates/
component/
{{name.pascalCase}}/
{{name.pascalCase}}.tsx
types/
{{name.kebabCase}}.type.ts
styles/
{{name.kebabCase}}.module.css
Содержимое {{name.pascalCase}}.tsx:
import cl from 'clsx'
import type { {{name.pascalCase}}Props } from './types/{{name.kebabCase}}.type'
import styles from './styles/{{name.kebabCase}}.module.css'
/**
* <Назначение компонента {{name.pascalCase}} в 1 строке>.
*
* Используется для:
* - <сценарий 1>
* - <сценарий 2>
*/
export const {{name.pascalCase}} = (props: {{name.pascalCase}}Props) => {
const { children, className, ...htmlAttr } = props
return (
<div {...htmlAttr} className={cl(styles.root, className)}>
{children}
</div>
)
}
При вводе user-profile получите:
UserProfile/
UserProfile.tsx
types/
user-profile.type.ts
styles/
user-profile.module.css
Модификаторы
| Модификатор | user-profile |
|---|---|
{{name}} |
user-profile |
{{name.pascalCase}} |
UserProfile |
{{name.camelCase}} |
userProfile |
{{name.snakeCase}} |
user_profile |
{{name.kebabCase}} |
user-profile |
{{name.screamingSnakeCase}} |
USER_PROFILE |
Настройки
| Ключ | Описание | По умолчанию |
|---|---|---|
templateFileGenerator.templatesPath |
Путь к шаблонам | .templates |
templateFileGenerator.overwriteFiles |
Перезапись существующих файлов | false |
templateFileGenerator.inputMode |
Режим ввода: webview или inputBox |
webview |
templateFileGenerator.language |
Язык интерфейса (ru / en) |
en |