📄MDX - Custom heading ID

[proven pine]

// astro.config.mjs
import { defineConfig } from 'astro/config';
import { rehypeHeadingIds } from '@astrojs/markdown-remark';
import mdx from "@astrojs/mdx";

export default defineConfig({
  build: {
    inlineStylesheets: "never",
  },
  integrations: [
    mdx()
  ],
  markdown: {
    rehypePlugins: [
      rehypeHeadingIds,
    ]
  },
  vite: {
    css: {
      devSourcemap: true,
    },
  },
});

[nimble pawn]

whats the requirement to have a heading id thats different to the heading text?

[proven pine]

i have very long titles and its Cyrillic

[nimble pawn]

hmm

[proven pine]

its just throw me Could not parse expression with acorn
mdx md.. with plugin.. without plugin (

[nimble pawn]

because thats not valid syntac

syntax

you need an extension to support it like this https://github.com/unicorn-utterances/rehype-slug-custom-id

i dont recommend this btw, you'll now need to think of a custom heading id for every heading, just seems extra work to do

[proven pine]

so poor docs. what i have to import in my config

[nimble pawn]

i mean not really, the docs for that link dont know anything about astro

https://docs.astro.build/en/guides/markdown-content/#markdown-plugins

you need to list it here

[proven pine]

listed. nothing helpful

tried this. nothing happens
https://github.com/imcuttle/remark-heading-id

[nimble pawn]

what do you mean by tried

[proven pine]

tried this plugins

[pallid stag]

About the ask: I'd also take advantage of custom IDs to be able to not break existing anchor links when renaming sections, for instance. In this case, there would be a fallback to the title-derived ID, if none defined.