Presets

Sketch supports various kinds of presets, which are designed to serve different functionalities. Some presets serve as aggregators for other presets, others provide extensibility, while others provide type safety and lsp integration.

As of now, these presets are available:

• Templating

  • Templating presets (extensible)

• Docker

  • Docker Compose file (extensible)
  • Docker Compose service (extensible)

• Git

  • Git repo
  • .gitignore (extensible)
  • .pre-commit-config.yaml (extensible)
  • Github workflow (extensible)
  • Github workflow job (extensible)
  • Github workflow step

• Rust

  • Cargo.toml (extensible, with merging of features for dependencies)

• Typescript

  • Typescript package
  • pnpm-workspace.yaml (extensible)
  • package.json (extensible, with extra features)
  • tsconfig.json (extensible, with merging of values for the references, include, exclude and files fields)
  • .oxlintrc.json (extensible)
  • vitest (not a full configuration for vitest.config.ts, but a basic testing setup)

These can be generated individually, or as part of another preset. You can find more information about each command in the cli reference.

Extending Presets

Some presets can extend other presets. When a preset is extended, the merging strategy for their fields works like this:

• Collections are merged and, in almost all cases, also deduped and sorted (except for cases where order matters such as a list of command arguments). If the collection is a map and the values in it are also maps (as is the case for the catalogs field in package.json or pnpm-workspace.yaml), the inner maps will be merged.
• Values that are also extensible (such as compilerOptions in a tsconfig preset) will be merged with the same rules as above
• All other values are overwritten, except if the previous value was present and the new value is null. This is to avoid merging values that come from partially-defined presets, where the missing fields are all unset. Generally speaking, the correct strategy to extend presets is to define a base and then add elements to it, rather than replacing other values.

Examples

This is a detailed example of the various kinds of presets that are available:

# `Cargo.toml` presets
cargo_toml_presets:
  base:
    package:
      version: "0.1.0"
      edition: "2024"

  cli-custom:
    extends_presets:
      - base
      - cli-tools
      - serde-ordered
    package:
      name: cli-custom
    dependencies:
      clap:
        features:
          - derive
      owo-colors:
        features:
          - supports-colors

  cli-tools:
    dependencies:
      ratatui: "0.29"
      clap: "4.5"
      serde: "1"
      owo-colors: "4"

  serde-ordered:
    dependencies:
      serde:
        version: "1"
        features:
          - preserve_order
      indexmap:
        version: "2.11"
        features:
          - serde

# Docker Compose presets
docker:
  service_presets:
    # A base service preset with common configurations
    base_service:
      environment:
        TZ: Europe/Berlin
      networks:
        - my_network

    # A preset for a db service
    database:
      extends_presets:
        - base_service
      image: postgres

    caddy:
      extends_presets:
        - base_service
      image: lucaslorentz/caddy-docker-proxy:ci-alpine
      networks:
        - my_network
      ports:
        - 80:80
        - 443:443

  compose_presets:
    # Base preset for a compose file
    base:
      volumes:
        my_volume:
          external: true
      networks:
        my_network:
          external: true

    extended:
      extends_presets:
        - base
      services:
        # Using the service preset by ID
        db: database
        my_service:
          networks:
            - my_network
          volumes:
            - my_volume:/target
      volumes:
        my_other_volume:
          external: true

# Gitignore presets
gitignore_presets:
  # Can be a string
  base:
    content: |
      *.env
      dist
  # Or a list of strings
  ts:
    extends_presets:
      # When being merged, the new entries are placed at the top
      - base
    content:
      - "*.tsBuildInfo"
      - node_modules

# Pre-commit presets
pre_commit_presets:
  # Commonly used repo
  base:
    repos:
      - repo: https://github.com/gitleaks/gitleaks
        rev: v8.28.0
        hooks:
          - id: gitleaks

  # Hooks specific to typescript projects
  typescript:
    # Extending the base preset
    extends_presets:
      - base
    repos:
      - repo: local
        hooks:
          - id: oxlint
            name: oxlint
            entry: oxlint
            language: system
            files: '\.svelte$|\.js$|\.ts$'
            types: [file]

# Git presets
git_presets:
  ts_package:
    workflows:
      - file_name: my_workflow.yaml
        # Preset ID
        id: extended
    # License file to generate
    license: Apache-2.0
    # Selecting a preset
    gitignore: ts
    pre_commit: typescript

    # Templates that will be generated with this preset
    # starting from the new repo's root
    with_templates:
      - id: dockerfile

    # Commands to run before generation, from the root of the new project
    hooks_pre:
      - command:
          # Inlining a new template definition here,
          # but as always, we can use stored templates too
          name: pre_hook
          content: "echo '{{ greeting }}' > pre.txt"
        context:
          greeting: hi

    # Commands to run after generation, from the root of the new project
    hooks_post:
      - command:
          name: post_hook
          content: "echo '{{ greeting }}' > post.txt"
        context:
          greeting: hi

typescript:
  # By default, typescript and oxlint are added to
  # the dependencies
  no_default_deps: true

  # By default, all versions marked with `latest` are converted to
  # a version range starting from the current version
  no_convert_latest_to_range: true

  # Version range to use when converting from `latest`
  version_range: patch

  # `pnpm-workspace.yaml` presets
  pnpm_presets:
    base:
      # All the dirs listed here will be created automatically
      # when new monorepos are created
      packages:
        - packages/*
        - apps/*
      onlyBuiltDependencies:
        - esbuild
      minimumReleaseAge: 1440

  # `package.json` presets
  package_json_presets:
    # Defining some reusable fields such as some common scripts and dependencies
    frontend:
      description: I am the base preset
      scripts:
        build: vite build
        dev: vite dev
      devDependencies:
        tailwindcss: "*"
        vite: "*"

    svelte_frontend:
      extends_presets: ["frontend"]
      # Adding new fields
      license: MIT
      # Overriding others
      description: I am the frontend preset
      # And merging dependencies
      devDependencies:
        svelte: "*"


  # Tsconfig presets
  ts_config_presets:
    base:
      references:
        - path: /some/path
      include:
        - src
      compilerOptions:
        noEmit: true
        verbatimModuleSyntax: true

    extended:
      extends_presets:
        - base
      # Unlike in real tsconfigs with `extends`, references are merged here,
      # and so are all other collections such as `files` or `include`.
      references:
        - path: /other/path
      include:
        - tests
      compilerOptions:
        # Whereas other fields are overwritten
        noEmit: false


  # Oxlint presets
  oxlint_presets:
    base:
      ignorePatterns:
        - "**/node_modules/**"

    extended:
      extends_presets:
        - base
      ignorePatterns:
        - .cache

  # Vitest presets
  vitest_presets:
    base:
      # Where the config file should be generated, starting from
      # the root of the package.
      # It defaults to the value of `tests_dir`
      out_dir: null

      # The directory to use for tests, from the root of the package
      tests_dir: tests

      # The directory, inside `tests_dir`, that contains the setup files for tests.
      # A file named `tests_setup.ts`, containing some basic testing boilerplate,
      # will be generated inside of it.
      setup_dir: setup

      # A list of setup files (the paths will be joined to the `setup_dir`)
      # `tests_setup.ts` will be added automatically.
      setup_files:
        - somefile.ts
        - anotherfile.ts
      environment: jsdom
      silent: passed-only


  # Package presets
  package_presets:
    example:
      name: example

      # For every preset, we can either refer to them
      # by their id...
      package_json: svelte_frontend

      # ...or we can inline a preset definition
      oxlint:
        extends_presets:
          - extended
        ignorePatterns:
          - .output

      # We can define one or many tsconfig files
      ts_config:
        # Can be omitted, would default to `tsconfig.json`
        - output: tsconfig.json
          config:
            # Once again creating a new config here with some extras
            extends_presets:
              - extended
            include:
              - scripts

      vitest: base