@vuepress/types exports four functions:

• defineConfig
• defineConfig4CustomTheme
• defineTheme
• definePlugin

Note that using @vuepress/types is equivalent to using vuepress/config.

Plugin Type

If you already have some VuePress plugins written in JS, you can leverage your IDE's intellisense with jsdoc type hints:

/**
 * @type {import('@vuepress/types').Plugin}
 */
module.exports = {
  ready() {
    // ...
  }
};

Alternatively, you can use the defineConfig helper which should provide intellisense without the need for jsdoc annotations:

import { definePlugin } from "@vuepress/types";

export default definePlugin({
  // ...
});

Plugin Options Type

Type of plugin options also supports passing in through generic type:

import { definePlugin } from "@vuepress/types";

interface Options {
  name: string;
}

export default definePlugin<Options>((options, ctx) => {
  return {
    ready() {
      return ctx.base + options.name;
    }
  };
});

Theme Type

Similar to plugin, the only difference is the type you use, and the define function:

 /**
- * @type {import('@vuepress/types').Plugin}
+ * @type {import('@vuepress/types').Theme}
  */

-import { definePlugin } from "@vuepress/types";
+import { defineTheme } from "@vuepress/types";

-export default definePlugin({
+export default defineTheme({
   // ...
 });

Theme Config Type

Type of theme config also supports passing in through generic type:

import { defineTheme } from "@vuepress/types";

interface ThemeConfig {
  lang: string;
}

export default defineTheme<ThemeConfig>((themeConfig, ctx) => {
  return {
    ready() {
      return ctx.base + themeConfig.lang;
    }
  };
});

Notes

It is worth noting that, unlike the site configuration, i.e. .vuepress/config.js, if you use TypeScript to write theme or plugin, you still need to compile it into JavaScript before publishing it to NPM.