Advice on how to type custom plugin

[sarimabbas]

Hello! I am dipping my toes into the unified ecosystem and enjoying it so far. Thanks to the maintainers for their work :)

I am currently trying to write a remark plugin for my blog that copies relative images to a public folder. One question I had was how to type the function signature for the plugin.

This is what I have so far:

import { Image } from "mdast";
import { Transformer } from "unified";
import { visit } from "unist-util-visit";

interface PluginOptions {}

// how to type this function signature? 
export const remarkNextImages = (options: PluginOptions) => {
  const {  } = options;
  const transformer: Transformer = (mdast, vfile) => {
    visit(mdast, "image", (node: Image, index, parent) => {
    });
  };
  return transformer;
};

And in my markdown lib (contentlayer):

// ...
 markdown: {
    remarkPlugins: [
      [
        remarkNextImages,
        {
          // ...options
        },
      ],
    ],
  },

This works, however I do not get Intellisense when hovering over options. This pattern of passing options as part of an array is also new to me. Is there any way to infer the types of the options without casting (e.g. options as PluginOptions)?

I checked the unified docs and this forum but could not find examples. Would appreciate any help. Thanks so much!

[wooorm]

See https://github.com/unifiedjs/unified#types

[wooorm]

And see all the existing plugins as inspiration. What works for me often, is to look at code that is similar to what I want to do, and look at how they do it!

[sarimabbas]

omg how did i miss that 🙈

sounds good and thank you for your response!