Skip to content

Commit

Permalink
Merge branch 'main' of github.com:kktjs/markdown-react-code-preview-l…
Browse files Browse the repository at this point in the history
…oader
  • Loading branch information
SunLxy committed May 7, 2022
2 parents 52d6339 + 4082343 commit f8735c1
Show file tree
Hide file tree
Showing 3 changed files with 17 additions and 13 deletions.
12 changes: 7 additions & 5 deletions core/README-zh.md
Original file line number Diff line number Diff line change
Expand Up @@ -86,10 +86,10 @@ mdObj.codeBlock // => 组件源码索引对象,从 markdown 索引到的示
codeBlock: {
17: 'import React from ...',
77: 'import React from ...',
base23: 'import React from ...'
demo12: 'import React from ...'
},
components: { 17: ƒ, 77: ƒ, base23: ƒ },
languages: { 17: 'jsx', 77: 'jsx', base23: 'jsx'},
components: { 17: ƒ, 77: ƒ, demo12: ƒ },
languages: { 17: 'jsx', 77: 'jsx', demo12: 'jsx'},
source: "# Alert 确认对话框...."
}
```
Expand All @@ -109,7 +109,7 @@ export type CodeBlockData = {

## 配置 meta 标识

注意:需要在代码块示例中添加特殊的 `meta` 标识,`loader` 才会去索引对于的 `react` 示例,进行代码转换。
注意 ⚠️:需要在代码块示例中添加特殊的 `meta` 标识,`loader` 才会去索引对于的 `react` 示例,进行代码转换。

1. `mdx:` 特殊标识前缀
2. `mdx:preview` 控制是否进行进行示例索引,通过对应所在行号,获取需要的示例对象。
Expand All @@ -123,8 +123,10 @@ const Demo = ()=>{
}

export default Demo
\```
\```
```

```markdown
\```tsx mdx:preview:demo12
import React from "react"
const Demo = ()=>{
Expand Down
12 changes: 7 additions & 5 deletions core/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -86,10 +86,10 @@ mdObj.codeBlock // => The component source code index object, the sample sour
codeBlock: {
17: 'import React from ...',
77: 'import React from ...',
base23: 'import React from ...'
demo12: 'import React from ...'
},
components: { 17: ƒ, 77: ƒ, base23: ƒ },
languages: { 17: 'jsx', 77: 'jsx', base23: 'jsx'},
components: { 17: ƒ, 77: ƒ, demo12: ƒ },
languages: { 17: 'jsx', 77: 'jsx', demo12: 'jsx'},
source: "# Alert 确认对话框...."
}
```
Expand All @@ -109,7 +109,7 @@ Pass the `markdown` file content string, and return the converted code block par

## Configure meta ID

Note: You need to add a special `meta` identifier to the code block example, and `loader` will index the `react` example for code conversion.
Note ⚠️: You need to add a special `meta` identifier to the code block example, and `loader` will index the `react` example for code conversion.

1. `mdx:` special identifier prefix
2. `mdx:preview` Controls whether to perform example indexing, and obtain the required example object through the corresponding line number.
Expand All @@ -123,8 +123,10 @@ const Demo = ()=>{
}

export default Demo
\```
\```
```

```markdown
\```tsx mdx:preview:demo12
import React from "react"
const Demo = ()=>{
Expand Down
6 changes: 3 additions & 3 deletions website/public/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,9 +4,9 @@
<meta charset="utf-8" />
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">
<meta name="theme-color" content="#000000" />
<title>React Monorepo Template</title>
<meta name="keywords" content="react,simple,monorepo,template,component,project,package,development" />
<meta name="description" content="Simple React package development project example template." />
<title>markdown-react-code-preview-loader</title>
<meta name="keywords" content="react,loader,monorepo,react-component,component,webpack-loader,webpack5,webpack" />
<meta name="description" content="Index example text in Markdown, converted to React components. The current package is the `loader` of `webpack`, which loads the `markdown` document by configuring the current `loader`, returning a `JS` object containing the `markdown` text, the example index in the `markdown` text." />
<link rel="icon" href="%PUBLIC_URL%favicon.ico" />
<!-- <link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>🦖</text></svg>"> -->
</head>
Expand Down

0 comments on commit f8735c1

Please sign in to comment.