3pp-mirror/docusaurus
1
0
Fork 0
mirror of https://github.com/facebook/docusaurus.git synced 2025-05-17 19:16:58 +02:00
Code Issues Projects Releases Packages Wiki Activity

docs(website): use MDX comments instead of HTML comments (#8516)

Browse source
This commit is contained in:
Sébastien Lorber 2023-01-06 16:22:01 +01:00 • committed by GitHub
parent 5a59378e11
commit 9c9d17d6aa
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
38 changed files with 79 additions and 151 deletions
Download patch file Download diff file Expand all files Collapse all files

18
website/docs/guides/markdown-features/markdown-features-react.mdx
View file

@ -76,7 +76,7 @@ I can write **Markdown** alongside my _JSX_!
Since all doc files are parsed using MDX, anything that looks like HTML is actually JSX. Therefore, if you need to inline-style a component, follow JSX flavor and provide style objects.
<!-- prettier-ignore -->
{/* prettier-ignore */}
```jsx
/* Instead of this: */
<span style="background-color: red">Foo</span>
@ -94,7 +94,7 @@ In addition, MDX is not [100% compatible with CommonMark](https://github.com/fac
You can also import your own components defined in other files or third-party components installed via npm.
<!-- prettier-ignore -->
{/* prettier-ignore */}
```md
<!-- Docusaurus theme component -->
import TOCInline from '@theme/TOCInline';
@ -339,7 +339,7 @@ Use JSX within JSX tag, or move the Markdown to the outer layer:
<div className={styles.wrappingBlock}>
```
<!-- prettier-ignore -->
{/* prettier-ignore */}
```jsx
<div style={{color: 'red'}}>
**Bold still doesn't work**
@ -365,7 +365,7 @@ Add an empty new line:
<div className={styles.wrappingBlock}>
```
<!-- prettier-ignore -->
{/* prettier-ignore */}
```jsx
<div style={{color: 'red'}}>
@ -395,7 +395,7 @@ Add an empty new line:
<div className={styles.wrappingBlock}>
```
<!-- prettier-ignore -->
{/* prettier-ignore */}
```jsx
<div style={{color: 'red'}}>
@ -425,7 +425,7 @@ Don't indent:
<div className={styles.wrappingBlock}>
```
<!-- prettier-ignore -->
{/* prettier-ignore */}
```jsx
<div style={{color: 'red'}}>
@ -461,14 +461,13 @@ npm install --save raw-loader
Now you can import code snippets from another file as it is:
<!-- prettier-ignore-start -->
{/* prettier-ignore */}
```jsx title="myMarkdownFile.mdx"
import CodeBlock from '@theme/CodeBlock';
import MyComponentSource from '!!raw-loader!./myComponent';
<CodeBlock language="jsx">{MyComponentSource}</CodeBlock>
```
<!-- prettier-ignore-end -->
```mdx-code-block
import CodeBlock from '@theme/CodeBlock';
@ -507,13 +506,12 @@ By convention, using the **`_` filename prefix** will not create any doc page an
This is text some content from `_markdown-partial-example.mdx`.
```
<!-- prettier-ignore-start -->
{/* prettier-ignore */}
```jsx title="someOtherDoc.mdx"
import PartialExample from './_markdown-partial-example.mdx';
<PartialExample name="Sebastien" />
```
<!-- prettier-ignore-end -->
```mdx-code-block
import PartialExample from './_markdown-partial-example.mdx';