jblu/jonbio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: resolve mdx imports relative to components dir

Browse Source
This commit is contained in:
Timothy Lin
2021-07-04 12:36:26 +08:00
parent e701b6a52a
commit 5af6209e5a
2 changed files with 28 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
data/blog/new-features-in-v1.mdx
View File

@ -51,6 +51,25 @@ Please check your markdown output to verify.
Some new possibilities include loading components directly in the mdx file using the import syntax and including js code which could be compiled at the build step.
For example, the following jsx snippet can be used directly in an MDX file to render the page title component:
```js
import PageTitle from './PageTitle.js'
;<PageTitle> Using JSX components in MDX </PageTitle>
```
import PageTitle from './PageTitle.js'
<PageTitle> Using JSX components in MDX </PageTitle>
The default configuration resolves all components relative to the `components` directory.
**Note**:
Components which require external image loaders would require additional esbuild configuration.
Components which are dependent on global application state on lifecycle like the Nextjs `Link` component would also not work with this setup as each mdx file is built indepedently.
For such cases, it is better to use component substitution.
## Layouts
You can map mdx blog content to layout components by configuring the frontmatter field. For example, this post is written with the new `PostSimple` layout!