antfu/vscode-ext-gen

Generate TypeScript meta info for VS Code extension from package.json

vscode-ext-gen

Generate TypeScript meta info and Markdown tables for VS Code extension from package.json

Usage

npx vscode-ext-gen

Under the VS Code extension project root

Continuous Update

We recommend using the Run on Save extension with the following config in your .vscode/settings.json to always generate the meta file on save:

{
  "emeraldwalk.runonsave": {
    "commands": [
      {
        "match": "package.json",
        "isAsync": true,
        "cmd": "npm run update"
      }
    ]
  }
}

Examples

Generates src/generated-meta.ts file with the following content which syncs with your package.json:

export namespace ExtensionMeta {
  // Meta info
  export const publisher = 'antfu'
  export const name = 'iconify'
  export const version = '0.8.1'
  export const displayName = 'Iconify IntelliSense'
  export const description = 'Intelligent Iconify previewing and searching for VS Code'
  export const extensionId = `${publisher}.${name}`

  /**
   * Type union of all commands
   */
  export type CommandKey =
    | 'iconify.toggle-annotations'
    | 'iconify.clear-cache'
    // ...

  /**
   * Commands map registed by `antfu.iconify`
   */
  export const commands = {
    /**
     * Toggle Annotations
     * @value `iconify.toggle-annotations`
     */
    toggleAnnotations: 'iconify.toggle-annotations',
    // ...
  } satisfies Record<string, CommandId>

  /**
   * Type union of all configs
   */
  export type ConfigKey =
    | 'iconify.annotations'
    | 'iconify.position'
    // ...

  export interface ConfigKeyTypeMap {
    'iconify.annotations': boolean
    'iconify.position': ('before' | 'after')
    // ...
  }

  export interface ConfigMeta<T extends keyof ConfigKeyTypeMap> {
    key: T
    default: ConfigKeyTypeMap[T]
  }

  /**
   * Configs map registed by `antfu.iconify`
   */
  export const configs = {
    /**
     * Enabled Iconify inline annotations
     * @key `iconify.annotations`
     * @default `true`
     * @type `boolean`
     */
    annotations: {
      key: 'iconify.annotations',
      default: true,
    } as ConfigMeta<'iconify.annotations'>,
    /**
     * Position the icon before or after the icon name
     * @key `iconify.position`
     * @default `"before"`
     * @type `string`
     */
    position: {
      key: 'iconify.position',
      default: 'before',
    } as ConfigMeta<'iconify.position'>,

    // ...
  }
}

export default ExtensionMeta

On usage:

import { commands, workspace } from 'vscode'
import * as meta from './generated-meta'

export function activate() {
  console.log(meta.displayName, meta.extensionId)

  const config = workspace
    .getConfiguration()
    .get(meta.configs.position.key, meta.configs.position.default)

  commands.registerCommand(meta.commands.toggleAnnontations, () => {
    // ...
  })
}

For a full example, check this file

Generate Docs

Add comments <!-- commands --> and <!-- configs --> as the slots in your README.md:

# Your Extension

## Commands

<!-- commands -->
<!-- commands -->

## Configurations

<!-- configs -->
<!-- configs -->

They will be replaced with the generated tables when you run npx vscode-ext-gen.

Sponsors

License

MIT License © 2023-PRESENT Anthony Fu