代码之家 › 专栏 › 技术社区 › dougmacklin

盖茨比。js:在Markdown中预处理相对路径链接

contentful gatsby markdown reactjs

10

dougmacklin · 技术社区 · 6 年前

我想知道是否有一种方法,可以通过为 gatsby-transformer-remark ,可以将相对路径链接转换为使用 <Link> 从…起 gatsby-link 。

例如,假设我在降价文件中有以下内容:

# Here is a Header

Check out my about page:

[About](/about)

如果我导入此标记并使用以下内容显示它:

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

然后,当点击“关于”链接时,它打破了单页应用程序的魔法。

有什么方法可以防止这种情况发生吗?提前谢谢。

1 回复 | 直到 6 年前

1

15

Nenu 6 年前

安装它:

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

将其添加到 盖茨比配置。js公司 文件:

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

你可以在以下网址找到关于如何使用remark with Gatsby的很好的文档 https://using-remark.gatsbyjs.org/

对于你的问题,我发现 this article here 。

推荐文章

theDC · 如何在Swift中从Contentful访问图像?

6 年前

Barney · 从有内容的数据以编程方式创建Gatsby页面

6 年前

Chris · 心满意足。NET缓存

7 年前

Drenai · 将HTML元素和类属性添加到有内容的CMS降价内容?

7 年前

metahamza · 内容丰富的Javascript API-通过slug查找条目

8 年前