Support anchor links

[AndersDJohnson]

Support anchor/hash links. Refer to remix-run/react-router#394 (comment) for a potential implementation to introduce to the Router in lib/utils/web-entry.js.

[KyleAMathews]

Hey, this is an really interesting idea. My preference would be that it gets built-in to React Router. Failing that (or in the meantime), my preference would be we add a hook to Gatsby so you can add support for this in userspace though perhaps it's innocuous enough that we ship it to everyone.

[AndersDJohnson]

@KyleAMathews See my PR #321.

[AndersDJohnson]

FYI I've published to npm a solution based on remix-run/react-router#394 (comment) as a standalone module called anchorate.

[KyleAMathews]

@adjohnson916 anchorate looks cool. Perhaps even include it by default in at least the documentation starter as being able to link to headers is a feature people expect from using Github, etc.

We'd also need to add a header-id plugin for markdown-it. Do you use Markdown-it? Is there a plugin you'd recommend?

[MoOx]

I did that if this can help https://github.com/MoOx/markdown-it-toc-and-anchor but this days I use remark as the AST approach is simpler for my brain.

[KyleAMathews]

@MoOx looks good! Thanks for the pointer.

Good to know re: Remark vs Markdown-It. I don't really like that Gatsby hard-codes Markdown-It. I want to split Gatsby core soon into plugins so it'll be easy to swap in and out Markdown renders (as one example).

Also https://github.com/wooorm/remark-lint looks cool.

[AndersDJohnson]

For ideas on anchors with markdown-it, see markdown-it/markdown-it#28.

Also consider https://github.com/bryanbraun/anchorjs that generates anchors with client-side JS, to which I recently added npm support.