问题标签 [mdxjs]

我正在开发一个 MDX 博客，并使用灰质来提取前端、内容和摘录。正如文档中提到的，我正在使用一个函数将内容的前 4 行提取为excerpt. 但这会提取文件的所有 4 行，包括标签/md 符号。

是否可以获得不包括符号的文件内容？

例如，我想要以下内容：

期望的输出：

我正在使用 Nextjs 创建一个博客mdx-bundler，我注意到标签内的代码块<pre>被转换为 HTML 元素 -而应该作为纯文本返回。我创建了一个示例stackblitz 实例来展示这个问题。

注意：我在MDXjs Playground中也注意到了同样的问题，但在mdxjs v1.6.21 playgroung中没有看到同样的问题。所以我猜这是MDXjs更新版本的问题

下表显示了 HTML 源代码的差异。<code>在标签内使用代码块时应生成该元素<pre>。另请注意，<pre>生成了 2 个标签。

电流输出	预期产出

例子：

例如，如果您在 Stack-Overflow 或 GitHub 的 pre 标记内编写代码块，它们将作为纯文本返回（如下示例）。

下面的示例<pre>标记（预期输出）：

下面的例子code-block：

编辑：

我在 mdx repo 中找到了一个 PullRequest，其中 Playground 的初始版本是在 v0 中创建的

这些是此版本的相关文件：

• Playground -editor.js使用mdx.sync()函数从 Markdown 生成 jsx
• index.jsmdx.sync()函数最初创建的地方。

我使用默认的 Storybook Webpack 配置以及我现有的数据。我在故事侧栏中看不到任何 *.mdx 文件。

起初我只是用config.module.rules现有 webpack 配置中的规则替换了所有内容，我收到了这个错误：意外的默认错误消息

然后我为 *.mdx 文件添加了这个加载器：

因此，错误消失了，但 *.mdx 文件也没有显示。我尝试以这种方式在“@mdx-js/loader”之前添加“babel-loader”：

此外，我检查了不同的规则顺序，config.module.rules并将此规则直接添加到现有的“webpack.config”中。我注意到“mdx”规则中的加载程序无关紧要，例如，这可以正常工作，但文件仍然没有显示：

mdx 文件示例：

我的 webpack.config.js：

我正在尝试在 MDX 文件中添加一个包含一些大括号的代码片段。我希望括号显示。我遇到的问题是大括号在下拉菜单中很特殊。关于如何将特殊字符添加到下拉列表的任何建议？

div {背景颜色：黄色；填充：20px；显示：无；} 跨度：悬停 div {显示：块；}

我正在尝试在这样的 javascript 文件中运行我的 jsx：

然后我有一个 mdx 文件，它像这样导入反应组件：

这不会创建组件，只会Create New Component输出到控制台，我希望两者console.logs都能打印。

当我将组件导入到我的 MDX 文件中并放置 html 时，它就可以正常工作：

然后我有一个 mdx 文件，它像这样导入反应组件：

Created Component这将在控制台中创建组件和输出。

我需要做些什么来使用第一种导入文件的方法，这样我就不必将元素放在我的所有 mdx 文件中了吗？