@mdx-js/vue

MDX 的 Vue 上下文。

¥Vue context for MDX.

内容

¥Contents

• 这是什么？

  ¥What is this?

• 我什么时候应该使用这个？

  ¥When should I use this?

• 安装

  ¥Install

• 使用

  ¥Use

• API

  • MDXProvider(properties?)

  • useMDXComponents(components?)

  • Props

• 类型

  ¥Types

• 兼容性

  ¥Compatibility

• 安全

  ¥Security

• 贡献

  ¥Contribute

• 许可证

  ¥License

这是什么？

¥What is this?

该包是一个基于上下文的组件提供程序，用于将 Vue 与 MDX 结合起来。

¥This package is a context based components provider for combining Vue with MDX.

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

¥When should I use this?

MDX 不需要此包即可与 Vue 配合使用。请参阅 ¶ 使用 MDX 中的 MDX 提供者 了解何时以及如何使用 MDX 提供程序。

¥This package is not needed for MDX to work with Vue. See ¶ MDX provider in § Using MDX for when and how to use an MDX provider.

安装

¥Install

这个包是 仅限 ESM。在 Node.js（版本 16+）中，使用 npm 安装：

¥This package is ESM only. In Node.js (version 16+), install with npm:

npm install @mdx-js/vue

在 Deno 中使用 esm.sh：

¥In Deno with esm.sh:

import {MDXProvider} from 'https://esm.sh/@mdx-js/vue@3'

在带有 esm.sh 的浏览器中：

¥In browsers with esm.sh:

<script type="module">
  import {MDXProvider} from 'https://esm.sh/@mdx-js/vue@3?bundle'
</script>

使用

¥Use

import {MDXProvider} from '@mdx-js/vue'
import {createApp} from 'vue'
import Post from './post.mdx'
// ^-- Assumes an integration is used to compile MDX to JS, such as
// `@mdx-js/esbuild`, `@mdx-js/loader`, `@mdx-js/node-loader`, or
// `@mdx-js/rollup`, and that it is configured with
// `options.providerImportSource: '@mdx-js/vue'`.

createApp({
  data() {
    return {components: {h1: 'h2'}}
  },
  template: '<MDXProvider v-bind:components="components"><Post /></MDXProvider>',
  components: {MDXProvider, Post}
})

👉 注意：你不必使用 MDXProvider，可以直接传递组件：

¥👉 Note: you don’t have to use MDXProvider and can pass components directly:

Diff

-createApp({
-  data() {
-    return {components: {h1: 'h2'}}
-  },
-  template: '<MDXProvider v-bind:components="components"><Post /></MDXProvider>',
-  components: {MDXProvider, Post}
-})
+createApp(Post, {components: {h1: 'h2'}})

请参阅 ¶ 入门中的 Vue 了解如何开始使用 MDX 和 Vue。请参阅 ¶ 使用 MDX 中的 MDX 提供者 了解如何使用 MDX 提供程序。

¥See ¶ Vue in § Getting started for how to get started with MDX and Vue. See ¶ MDX provider in § Using MDX for how to use an MDX provider.

API

该包导出标识符 MDXProvider 和 useMDXComponents。没有默认导出。

¥This package exports the identifiers MDXProvider and useMDXComponents. There is no default export.

MDXProvider(properties?)

MDX 上下文的提供程序（Component 到 vue）。

¥Provider for MDX context (Component from vue).

useMDXComponents(components?)

从 MDX 上下文获取当前组件。

¥Get current components from the MDX Context.

参数

¥Parameters

没有参数。

¥There are no parameters.

返回

¥Returns

当前组件 (MDXComponents 从 mdx/types.js)。

¥Current components (MDXComponents from mdx/types.js).

Props

MDXProvider（TypeScript 类型）的配置。

¥Configuration for MDXProvider (TypeScript type).

字段

¥Fields

• components（MDXComponents 从 mdx/types.js，可选）- 要使用的附加组件

  ¥components (MDXComponents from mdx/types.js, optional) — additional components to use

类型

¥Types

该包完全采用 TypeScript 类型。它导出附加类型 Props。

¥This package is fully typed with TypeScript. It exports the additional type Props.

为了使类型正常工作，请确保键入 TypeScript JSX 命名空间。这是通过安装和使用框架类型来完成的，如 vue 中所示。

¥For types to work, make sure the TypeScript JSX namespace is typed. This is done by installing and using the types of your framework, as in vue.

兼容性

¥Compatibility

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

¥Projects maintained by the unified collective are compatible with maintained versions of Node.js.

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

¥When we cut a new major release, we drop support for unmaintained versions of Node. This means we try to keep the current release line, @mdx-js/vue@^3, compatible with Node.js 16.

安全

¥Security

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

¥See § Security on our website for information.

贡献

¥Contribute

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

¥See § Contribute on our website for ways to get started. See § Support for ways to get help.

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

¥This project has a code of conduct. By interacting with this repository, organization, or community you agree to abide by its terms.

许可证

¥License

MIT © 合成器和 Vercel

¥MIT © Compositor and Vercel