[Poi] Use Markdown as React Components by Adding a Webpack Loader to Poi
Poi ships with many webpack loaders included, but you may run into scenarios where you'll need to customize and add your own. This lesson covers adding react-markdown-loader
to Poi to load Markdown files as React components.
Install:
npm i -D react-markdown-loader
poi.config.js:
module.exports = { webpack(config) { config.module.rules.push({ test: '/.md$/', loaders: [ 'babel-loader', 'react-markdown-loader' ] }) return config; } }
import Page from './Page.md' import {render} from 'react-dom'; render( <Page></Page>, document.getElementById('app') );