Gatsby.js: предварительная обработка ссылок относительного пути в Markdown

Мне интересно, есть ли способ, возможно, путем создания плагина для gatsby-transformer-remark, чтобы ссылки относительного пути могли быть преобразованы так, как если бы они использовали <Link> из gatsby-link.

Например, скажем, у меня есть следующее в файле уценки:

# Here is a Header

Check out my about page:

[About](/about)

Если я импортирую эту уценку и покажу ее с помощью:

<div dangerouslySetInnerHTML={{ __html: whatever.childMarkdownRemark.html }} />

Затем, когда нажимается ссылка «О программе», магия одностраничного приложения разрушается.

Есть ли способ предотвратить это? Заранее спасибо.


person dougmacklin    schedule 11.05.2018    source источник


Ответы (1)


Для этого существует плагин под названием gatsby-plugin-catch-links. .

Установите его:

npm install --save gatsby-plugin-catch-links

Добавьте его в свой файл gatsby-config.js:

// In your gatsby-config.js
plugins: [`gatsby-plugin-catch-links`];

Вы можете найти очень хорошую документацию о том, как использовать примечание с Гэтсби, по адресу https://using-remark.gatsbyjs.org/

По вашему вопросу я нашел эту статью. здесь.

person Nenu    schedule 16.05.2018
comment
Велп, это было легко, спасибо! Я назначу награду завтра (переполнение стека требует минимум 1 день). - person dougmacklin; 16.05.2018
comment
мой не работал. [link](/some-link) все еще перезагружается / откройте новую вкладку - person kubido; 14.07.2019
comment
Что, если мои внутренние ссылки являются ссылками на другие файлы .md? Нравится О программе. - person gpbl; 17.05.2020
comment
@gpbl Вы можете связать их с [my link should be called this](../relative_path_to_md_file_from_current_file). Вы должны были бы удалить .md в конце, хотя - person Ayush Mandowara; 13.02.2021