Skip to navigation

@mdx-js/node-loader

Node.js hooks (also knows as loaders) for MDX.

内容

这是什么?

此包包含 Node.js 钩子以添加对导入 MDX 文件的支持。 节点自定义 Hooks 目前是候选版本。

我什么时候应该使用这个?

如果你使用 Node 并且想要从文件系统导入 MDX 文件,则此集成非常有用。

如果你使用打包器(webpack、Rollup、esbuild)或打包器附带的站点构建器(Next.js)或构建系统(Vite),则可以使用其他集成: 见 § 集成

安装

这个包是 仅限 ESM。 在 Node.js(版本 16+)中,使用 npm 安装:

Shell
npm install @mdx-js/node-loader

使用

假设我们有一个 MDX 文档 example.mdx

MDX
export function Thing() {
  return <>World!</>
}

# Hello, <Thing />

…我们的模块 example.js 如下所示:

TypeScript
import {renderToStaticMarkup} from 'react-dom/server'
import React from 'react'
import Content from './example.mdx'

console.log(renderToStaticMarkup(React.createElement(Content)))

…然后运行:

Shell
node --loader=@mdx-js/node-loader example.js

…yields:

HTML
<h1>Hello, World!</h1>

注意: 如果你使用 Node 18 及更低版本,则可以忽略以下警告:

Plain text
(node:20718) ExperimentalWarning: Custom ESM Loaders is an experimental feature and might change at any > time
(Use `node --trace-warnings ...` to show where the warning was created)

注意: 如果你使用 Node 20 及更高版本,则会收到以下警告:

Plain text
(node:20908) ExperimentalWarning: `--experimental-loader` may be removed in the future; instead use > `register()`:
--import 'data:text/javascript,import { register } from "node:module"; import { pathToFileURL } from > "node:url"; register("%40mdx-js/node-loader", pathToFileURL("./"));'

你可以通过添加 register.js 文件来解决该问题:

TypeScript
import {register} from 'node:module'

register('@mdx-js/node-loader', import.meta.url)

…并运行 node --import ./register.js example.js

API

该包导出标识符 createLoaderload。 没有默认导出。

createLoader(options?)

创建 Node.js 钩子来处理 Markdown 和 MDX。

参数
  • optionsOptions,可选) — configuration

返回

Node.js hooks ({load}).

load

file: URL 加载到 MD(X) 文件。

请参阅 Node.js 文档中的 load 了解更多信息。

Options

配置(TypeScript 类型)。

选项与 CompileOptions@mdx-js/mdx 相同,但根据 webpack 的配置方式支持 development 选项。 你无法手动传递它。

类型

该包完全采用 TypeScript 类型。 它导出附加类型 Options。 请参阅我们网站上的 § 类型 了解信息。

兼容性

由统一集体维护的项目与 Node.js 的维护版本兼容。

当我们削减新的主要版本时,我们会放弃对未维护的 Node.js 版本的支持。 这意味着我们尝试保持当前版本 @mdx-js/node-loader@^3 与 Node.js 16 兼容。

安全

请参阅我们网站上的 § 安全 了解信息。

贡献

请参阅我们网站上的 § 贡献 了解入门方法。 请参阅 § 支持 了解获取帮助的方法。

该项目有 行为守则。 通过与此存储库、组织或社区交互,你同意遵守其条款。

许可证

MIT © Titus Wormer

MDX 中文网 - 粤ICP备13048890号