0.3.2 • Published 3 months ago
parcel-transformer-mdx v0.3.2
Parcel MDX transformer
Unofficial MDX 3 transformer plugin for Parcel 2
Supported features
React usage
Installation
npm init -y
npm i react react-dom
npm i parcel @parcel/config-default parcel-transformer-mdx -Dpackage.json
{
"scripts": {
"start": "parcel ./src/index.html",
"build": "parcel build ./src/index.html --public-url ."
}
}.parcelrc
{
"extends": "@parcel/config-default",
"transformers": {
"*.{md,mdx}": ["parcel-transformer-mdx"]
}
}index.html
<!doctype html>
<html>
<head>
<link
rel="stylesheet"
href="https://unpkg.com/prismjs@1.29.0/themes/prism-okaidia.css"
/>
</head>
<body>
<div id="root"></div>
<script type="module" src="index.jsx"></script>
</body>
</html>index.jsx
import { createRoot } from 'react-dom/client';
import Index from './index.mdx';
const root = createRoot(document.querySelector('#root'));
root.render(<Index />);index.mdx
---
title: Hello MDX
---
# Hello MDX
https://react.dev/
https://www.youtube.com/watch?v=VEoMT8pAxMAJSX compatible engines usage
- WebCell example: https://github.com/EasyWebApp/BootCell-document