当我从文件中导入某些内容.js或.ts文件时，.mdx我希望看到来自 VScode 的自动完成建议。

此外，当我在文件中定义变量时.mdx，我正在等待 VScode 会建议我这个变量的名称。

问题：

• 有可能吗？
• 如果不是，那么为什么以及何时可能？
• 如果是，那么我应该如何处理我的 VScode 才能使其按预期工作？

假设和我想要实现的目标。

请注意，此问题已由 Deepl Translations 翻译。

我想在 Next.js 中使用 mdx-js/react 来加载 mdx 文件。

环境。

操作系统：macOS Bigsur

节点：16.3

反应：17.0.2

下一个：12.0.7

我们将 npm 用于包。另外，我们不使用 Docker。

配置

包.json

next.config.js

代码

_app.tsx

样本.tsx

错误描述

我尝试过的事情

1. 检查错误消息
2. 重新安装库
3. 用一个新项目进行测试

我正在使用next-mdx-remote在我的 Next.js 项目中使用 MDX。

我一直在遵循 JetBrains WebStorm指南来构建它，这里他们使用 bootstrap 作为他们的 CSS，但我选择的 CSS 框架是 tailwind css。

问题是当我安装 tailwind css 或任何其他基于 tailwind css（如flowbite）的 CSS 时，MDX 页面失去了它的样式。

预期
添加顺风后我会得到什么

• tailwind.config.js

• _app.tsx

• 全局的.css

• [blogId].tsx

我正在将自定义 HTML 映射到我网站的一些降价元素。由于某种原因，在 中genId，构建失败，因为 props 可以是空字符串/null。但是，这只发生在生产构建中，并且一切都在本地完美运行。

我还注意到，在刷新时，id全部丢失，而在从单独页面加载的初始页面时，它们存在。

此代码的目的是将数据从降价标题中取出并将其转换为 CSS ID。

成分

刷新同一页面

从主页单击

零件

我们现在开始使用与核心项目分开的文档项目。这个想法是在核心项目中使用当前的MD文档，并通过URL加载MDX文件中的MD来访问文档项目中的文档。这是否可以通过使用类似于 import 语句的东西来实现？

我正在使用Next.js+创建一个博客MDX-Bundler，并使用 rehype 插件将附加内容添加到我的.html文件中.mdx。但我注意到，如果我有一个纯文本 url，它不会被转换为锚标记。我还找到了一个参考，提到 rehype 并没有这样做。

但是有没有办法做到这一点？

这在大多数采用降价输入的流行网站中都是可能的。甚至堆栈溢出中的这个问题也是基于降价的。如果我输入这样的 URL（https://google.com/或http://www.google.com/），它会在预览中转换为 URL。将 mdx 文件转换为博客文章时如何获得类似的功能。

我正在使用Next.js+创建一个博客MDX-Bundler并尝试使用remark-disable-tokenizers禁用“缩进代码块”。但我无法让它工作。我在这里找到了一个参考，它说我们可以remark-disable-tokenizers用于此目的。

这是我xdmoptions的参考：

这段代码写在 mdx 文件中，它显示在网页的中心，我希望这些代码片段单独显示在网页的右侧。

请求数据：

响应数据：

我正在使用mdx-bundlerand创建一个 Next.js 博客styled-components。我正在使用remark-mdx-images将图像导入 JSX。我创建了一个自定义组件 ( styled.div) 来嵌入next/image其中。

但是当我在浏览器中运行博客时，我收到一条错误消息，说validateDOMNesting(...): <div> cannot appear as a descendant of <p>.我尝试将其切换到styled.span，但它根本不显示图像，即使它在 DOM 中呈现

我还收到另一个警告：Expected server HTML to contain a matching <div> in <p>.

下面是我的代码

以下是完整的错误：

只需按照以下说明操作：https ://mdxjs.com/docs/getting-started/#create-react-app-cra

我做了以下事情：

然后按照入门指南，src/content.mdx像这样创建文件：

然后修改src/App.js如下：

当我运行该应用程序时，我在控制台上看到以下错误：

我错过了什么？

看起来 webpack 加载器或 babel 没有正确启动......不确定。