问题描述
我最近将我的gatsby帖子转换为使用gatsby-plugin-mdx
,并且大多数情况下过渡是无缝的,但是对于我的一些帖子,我遇到了一个问题-即代码中的代码区块正在解析,并且无法建立这些帖子。
这种情况发生在我正在写有关类和功能性React组件的帖子上,在我的一个示例中,我故意创建了一些错误的标记来说明这一点。 `gatsby-plugin-mdx` *似乎*正在解析它,然后由于错误而失败...
我该如何解决?有办法摆脱这些障碍吗?还是我需要使用其他插件?
config:
...
{
resolve: `gatsby-plugin-mdx`,options: {
extensions: [`.md`,`.mdx`],defaultLayouts: {
adventures: require.resolve("./src/views/Advanced.jsx"),default: require.resolve("./src/views/Advanced.jsx")
}
},gatsbyRemarkPlugins: [
{
resolve: `gatsby-plugin-catch-links`,options: {
excludePattern: /(excluded-link|external)/
}
},{
resolve: `gatsby-remark-prismjs`,options: {
classPrefix: "language-",inlineCodeMarker: null,aliases: {},showLineNumbers: false,noInlineHighlight: false,prompt: {
user: "root",host: "localhost",global: false
},escapeEntities: {}
}
},{
resolve: "gatsby-remark-relative-images",options: {
name: "uploads"
}
},{
resolve: "gatsby-remark-images",options: {
maxWidth: 2048
}
},{
resolve: "gatsby-remark-copy-linked-files",options: {
destinationDir: "static"
}
}
]
...
},
Markdown带有故意错误(它包装在反引号中,但不确定我如何在markdown中转义它们!):
class List extends Component {
render() {
return (
<h2>List title</h2>
<ul>
</ul>
)
}
}
解决方法
事实证明,此问题不是代码块。在此块之后的普通段落中包含包含的文本。将其包装在后面的刻度中可解决问题<div>