Custom Template Generator

Custom Template Generator is a Visual Studio Code extension that lets you quickly scaffold project folders and files from customizable templates, with variable substitution, optional files/lines, and cross-platform validation.

Features

• Generate entire folder structures for new projects with a single command.
• Generate individual files from local templates.
• Customizable templates: Define your own folder structures in your VS Code settings and create local file templates.
• Variable prompts with defaults: When generating a structure, the extension prompts you for variables (like project name or language) and automatically replaces them in your templates. Each variable can have a default value. These can be set in the folder structures.
• Optional files and template lines: Use [[?optionalKey]] markers in your templates and structures to conditionally include files or lines.
• Cross-platform validation: Prevents creation of files or folders with invalid or reserved names.
• Supports both files and folders: Easily specify which items are folders or files in your structure.
• Skips existing files/folders to avoid overwriting your work.

How It Works

1. Right-click a folder in the VS Code Explorer and select Generate Template, or use the command palette. Using the command in an empty workspace prompts you to choose a local parent folder.
2. Choose a structure (e.g., "Website").
3. Enter values for any variables (with defaults provided).
4. Decide on optional features (e.g., include CSS or JS).
5. The extension creates the specified folders and files, filling in templates with your values and skipping invalid or existing items.

📖 Want more detailed guidance? Check out the Complete Step-by-Step Guide for step-by-step examples.

Extension Settings

This extension contributes the following settings:

customTemplateGenerator.structures

An array of structure definitions. Each structure specifies:

• name: The name of the structure (shown in the picker).
• createNewFolder: Create a new folder upon generating a template. (optional)
• variables: An array of objects, each with:
  • varName: The variable name to prompt for (e.g., projectName).
  • default: The default value to pre-fill in the input box.
• optionals: An array of string keys for optional features (e.g., addCss).
• structure: An array of items, each with:
  • fileName: The file or folder path (relative to the workspace root).
  • template: The template to use (for files), or "folder" for folders.
  • optional: (optional) A key that makes this item optional, shown as a prompt.

customTemplateGenerator.templatesDirectory

A string path to the directory containing your template files. Template files should contain the content you want to generate for each file type with the variable and optional names between square brackets.

customTemplateGenerator.ignoredFolders

When generating a single file from a template, these folders won't show up in the template selection. They will however still be available to use in your structures.
Default value: [".git"]

📦 Migrating from "Folder Template Generator"

If you previously used "Folder Template Generator":

1. ✅ Your templates are fully compatible
2. Update your settings (find folderTemplateGenerator. and replace with customTemplateGenerator.)
3. Uninstall the old extension

Settings Migration:

• Old: "folderTemplateGenerator.templatesPath": "~/.vscode-templates"
• New: "customTemplateGenerator.templatesPath": "~/.vscode-templates"

Example settings.json

"customTemplateGenerator.structures": [
  {
    "name": "Website",
    "createNewFolder": true, //Optional
    "variables": [
      { "varName": "projectName",
        "default": "My Website"
      },
      { "varName": "projectLanguage",
        "default": "en"
      }
    ],
    "optionals": [
      "addCss",
      "addJs"
    ],
    "structure": [
      {
        "fileName": "index.html",
        "template": "indexHtml.html"
      },
      {
        "fileName": "css/mainstyle.css",
        "template": "mainstyleCss.css",
        "optional": "addCss"
      },
      {
        "fileName": "js/index.js",
        "optional": "addJs"
      },
      {
        "fileName": "pages",
        "template": "folder"
      },
      {
        "fileName": "images",
        "template": "folder"
      }
    ]
  }
],
"customTemplateGenerator.templatesDirectory": "C:/.Personal/file-templates",
"customTemplateGenerator.ignoredFolders": [".git", "other-templates"],

Example indexHtml.html template

<!DOCTYPE html>
<html lang="[[projectLanguage]]">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" type="text/css" href="css/mainstyle.css">[[?addCss]]
    <script defer src="js/index.js"></script>[[?addJs]]
    <title>[[projectName]]</title>
</head>

<body>
  <h1>[[projectName]]</h1>
</body>

</html>

Template Syntax

• Variables: Use [[variableName]] in your template lines to have them replaced with user input.
• Optionals: Use [[?optionalKey]] at the end of a line in your template, or as "optional": "key" in your structure. The user will be prompted to include/exclude these items.

Validation & Safety

• Cross-platform: The extension validates every part of file and folder names to avoid forbidden characters and reserved names (e.g., CON, PRN, <, >, :, ", /, \, |, ?, *).
• No overwrites: Existing files and folders are never overwritten—those items are skipped.
• One-click revert: After creation, you can instantly revert all created files and folders.

Known Issues

• Only works in local workspaces (not remote or virtual workspaces).
• Does not support advanced template logic (like loops or conditionals).

Changelog

See the full changelog on GitHub.

Contributing & Feedback

Found a bug or want a new feature?

• Open an issue on GitHub.
• Reach out on Discord: @qualyyy

Extension Guidelines

• VS Code Extension Guidelines

Enjoy using Custom Template Generator!