In Gatsby project with gatsby-transformer-remark, how to change Markdown link from folder1/filename.md to /folder1/filename/?

Question

In this Gatsby project, I use gatsby-transformer-remark to transform Markdown pages to html.

I have this issue.

Question: How can I configure gatsby-transformer-remark to rename all *.md link to */?

I think I need to explore How to change Markdown link relative path as preprocessing of gatsby-transformer-remark

Answer 1

I have find a solution: https://github.com/stephane-klein/gatsby-remark-convert-linker-from-md-to-html-example/commit/a941cf990be4a16c72c46e3c893f37509a3e5890

In plugins/gatsby-remark-relative-linker/index.js:

const visit = require('unist-util-visit');
module.exports = ({ markdownAST }) => {
  visit(markdownAST, 'link', node => {
    if (
      node.url &&
      !node.url.startsWith('//') &&
      !node.url.startsWith('http')
    ) {
      node.url = node.url.replace(/^(.*)\.md$/, (match, path) => {
        return `/${path}/`;
      })
    }
  });

  return markdownAST;
};

See the complete example here: https://github.com/stephane-klein/gatsby-remark-convert-linker-from-md-to-html-example