feat(v2): enable JSX in markdown using MDX (#1263)

* feat(v2): enable JSX in markdown

* reformat docs

* chore(v2): nits

* remove dummy test

* include .mdx extension

* add syntax highlighting with prismjs
This commit is contained in:
Endilie Yacop Sucipto 2019-03-08 01:02:47 +08:00 committed by GitHub
parent 801453fae6
commit 643addb729
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
10 changed files with 661 additions and 234 deletions

View file

@ -7,6 +7,7 @@
const Config = require('webpack-chain');
const CSSExtractPlugin = require('mini-css-extract-plugin');
const rehypePrism = require('@mapbox/rehype-prism');
const TerserPlugin = require('terser-webpack-plugin');
const path = require('path');
@ -105,10 +106,31 @@ module.exports = function createBaseConfig(props, isServer) {
.end();
applyBabel(jsRule);
const mdRule = config.module.rule('markdown').test(/\.md$/);
/*
Equivalent to:
// ...
{
test: /(\.mdx?)$/,
use: [
'babel-loader',
{
loader: '@mdx-js/loader',
options: { hastPlugins: [[rehypePrism, { ignoreMissing: true }]] }
},
'docusaurus/md-loader,
]
}
*/
const mdRule = config.module.rule('markdown').test(/(\.mdx?)$/);
applyBabel(mdRule);
mdRule
.use('markdown-loader')
.use('mdx-js-loader')
.loader('@mdx-js/loader')
.options({
hastPlugins: [[rehypePrism, {ignoreMissing: true}]],
});
mdRule
.use('docusaurus/md-loader')
.loader(mdLoader)
.options({
siteConfig,