问题标签 [mdxjs]

导入插件@mapbox/rehype-prism时，它似乎没有像预期的那样对语法高亮做任何事情。

我正在寻找链接到博客文章。

以上是我在主页上预览的模板，它适用于我的预览，在通过链接组件的行为列出所有帖子的页面的情况下，假定 slug 应附加到当前页面堆栈。

例如

在主页链接 =/{post.slug}

在博客列表链接 =tutorials/{post.slug}

问题是帖子页面是使用未嵌套在教程中的页面级别的 slug 生成的。我试图规避使用navigate()到达路由器的方法，但是在您最初使用链接组件导航到它们之前，这些页面不存在的问题。

我想知道是否有关于如何绕过这个而不对路径进行硬编码的任何想法，这样我就不需要单独的组件。

我试图在构建期间从远程 URL 加载文件以进行 WebPacked。这个文件是一个 MDX 文件，我正在使用 MDX vue-loader 来加载这个文件，以便在 Vue 应用程序中使用。

我正在部署的系统是使用无头 CMS 租用的，该 CMS 为系统中的某些页面提供动力。我想探索在构建时从远程 URL 加载 MDX 文件的可能性。

我已将 MDX 文件放在 GitHub Pages 上，并在构建时将远程 URL 作为环境变量传入。

结果是这样的（这里的想法是我可以在构建期间交换域以满足租户站点的要求）：

import('https://somedomain.com/content/home.mdx');

这在构建过程中失败并出现典型错误： dependencies not found please install them using npm --save https://somedomain.com/content/home.mdx

我可以 WebPack 忽略这个允许它构建的导入，但是它无法在浏览器中加载，因为浏览器只会加载带有 MIME 类型的 JS 的外部模块。更不用说这还没有通过 MDX 加载程序，所以我怀疑即使我可以让浏览器加载它，文件也不会被解析成可用的东西。

我意识到我可以在构建阶段从远程复制这些文件，但我希望有一种方法可以让浏览器拉取这个远程文件，或者让 WebPack 下载这个远程文件并将其打包到输出中。

有没有人有任何想法，如果这可能是可能的？提前谢谢了。

我已经使用 Netlify CMS 建立了一个 Gatsby 博客并添加netlify-cms-widget-mdx到支持.mdx文件中。我有一些已传递给的自定义组件，MDXProvider以使它们对我的所有.mdx文件全局可用，而无需在每个文件中导入它们。如何使用这些相同netlify-cms-widget-mdx的组件，以便在 Netlify CMS 中以预览模式正确呈现组件？包的自述文件中有一个代码块，我认为它回答了这个问题，但它没有说明我应该把这段代码放在哪里，更不用说我需要如何按照我需要的方式配置它了......感谢任何指导！

我创建了一个简单的默认页面，该页面使用来自 GraphCMS 的内容（图像和文本）呈现。

我可以查询和显示内容，但我不确定如何使图像适应视图/容器，因为我不知道如何访问图像和设置 CSS 类。

我正在使用插件“gatsby-plugin-mdx”来呈现以下内容：page.content.markdownNode.childMdx.body

这是我的 DefaultPage.tsx 文件：

以下是该行为的屏幕截图：

下面是我在浏览器中检查元素时的屏幕截图。看起来图像被包裹在一个段落中：

你能帮我理解如何为更小的视图/屏幕缩放图像吗？

我正在为我自己的博客使用 Gatsby 主题@lekoarts/gatsby-theme-minimal- blog。该主题还有一个父核心主题@lekoarts/gatsby-theme-minimal-blog-core，它使用了gatsby-plugin-mdx插件。

在我自己的博客中，我想更改插件gatsby-plugin-mdx的选项，例如设置

我尝试gatsby-plugin-mdx在我自己的博客中导入，gatsby-config.js但它不起作用我在解析现有.mdx文件时遇到错误。

还试图通过使用相同的内容创建但没有效果来隐藏gatsby-config.js核心主题的文件。src/@lekoarts/gatsby-theme-minimal-blog-core/gatsby-config.jslinkImagesToOriginal: true

如何更改父主题的插件选项？

核心主题的gatsby-config.js文件如下：

gatsby-config.js我的博客

我有一个简单的 Create React App，它在运行时加载一堆静态降价内容，并将一个mdx-loader应用于该内容以替换降价中找到的任何反应组件。

markdown 内容是动态的fileName，通过 React Router 获取。大约有 25 个按名称动态加载的降价文件。它们都在同一个文件夹中。我希望这些文件能够投入生产。有没有办法将这些文件添加到静态包中，或者从public文件夹中加载它们？我不确定使用 React 和 MDX 的最佳方法是什么。

我想知道是否有一种直接的方法可以在MDX JS页面上创建允许的组件和阻止的组件（包括 JSX 的 Markdown）。我想将 MDX 用于用户生成的内容，并意识到这样做存在很多安全问题；对此的任何提示表示赞赏。

我尝试在选项卡中添加降价代码，如文档中所述。

名称文件名具有.mdx扩展名。

这里是它的内容：

但我收到了这个错误：

不知道我做错了什么。

版本：

有什么建议吗？

我想用 NextJS、TypeScript 和 mdx-js 建立一个网站。我曾经yarn create next-app设置项目，然后添加 typescript 和 mdx-js。我创建了一个简单的 MDX 文件并将其导入 index.tsx。当我运行yarn dev时，项目构建得很好，我可以在浏览器中看到结果。

由于 TS 编译器最初不理解 MDX 文件的结构，因此我创建了一个 global.d.ts 文件，该文件告诉加载的 MDX 文件的默认导出提供了一个 JSX.Element：

但是，当我想在 index.tsx 中呈现导入的组件时，VS Code 在编辑器中显示错误 ts2604：

我真的不明白VS在抱怨什么，当我写react组件然后在其他地方导入它们时，我总是使用JSX.Element作为函数组件的返回类型。如前所述，下一个构建工作得很好。

到目前为止我已经尝试过：

• 添加import React from 'react'index.tsx 或 global.d.ts 并不能解决问题。
• 将类型更改为ReactNode（如在此博客文章中所做的那样）在 VS 中会产生相同的错误。
• 当我只是export default any;来自 global.d.ts 时，错误显然消失了，但我失去了类型支持，这不应该是真正的目标。
• 当然，在添加/更改 d.ts 文件时，我将其添加到 tsconfig.json 并多次重新启动 VS Code 以确保正确重新初始化 TS 语言服务器。

对于 MDX 文件，正确的 TS 模块声明应该如何？您可以在https://github.com/feO2x/nextjs-ts-mdx找到此问题的 MCVE

谢谢您的帮助！