|
|
|
@ -55,7 +55,7 @@ function reviveNodeOnClient(key, val) { |
|
|
|
|
|
|
|
// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
|
|
|
|
// ~~~~ IMPORTANT: BUMP THIS IF YOU CHANGE ANY CODE BELOW ~~~
|
|
|
|
const DISK_CACHE_BREAKER = 5; |
|
|
|
const DISK_CACHE_BREAKER = 6; |
|
|
|
// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
|
|
|
|
|
|
|
|
// Put MDX output into JSON for client.
|
|
|
|
@ -70,11 +70,11 @@ export async function getStaticProps(context) { |
|
|
|
|
|
|
|
// Read MDX from the file.
|
|
|
|
let path = (context.params.markdownPath || []).join('/') || 'index'; |
|
|
|
let mdxWithFrontmatter; |
|
|
|
let mdx; |
|
|
|
try { |
|
|
|
mdxWithFrontmatter = fs.readFileSync(rootDir + path + '.md', 'utf8'); |
|
|
|
mdx = fs.readFileSync(rootDir + path + '.md', 'utf8'); |
|
|
|
} catch { |
|
|
|
mdxWithFrontmatter = fs.readFileSync(rootDir + path + '/index.md', 'utf8'); |
|
|
|
mdx = fs.readFileSync(rootDir + path + '/index.md', 'utf8'); |
|
|
|
} |
|
|
|
|
|
|
|
// See if we have a cached output first.
|
|
|
|
@ -87,7 +87,7 @@ export async function getStaticProps(context) { |
|
|
|
// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
|
|
|
|
// ~~~~ IMPORTANT: Everything that the code below may rely on.
|
|
|
|
// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
|
|
|
|
mdxWithFrontmatter, |
|
|
|
mdx, |
|
|
|
mdxComponentNames, |
|
|
|
DISK_CACHE_BREAKER, |
|
|
|
PREPARE_MDX_CACHE_BREAKER, |
|
|
|
@ -107,24 +107,26 @@ export async function getStaticProps(context) { |
|
|
|
); |
|
|
|
} |
|
|
|
|
|
|
|
// Parse Frontmatter headers from MDX.
|
|
|
|
const fm = require('gray-matter'); |
|
|
|
const {content: mdxWithoutFrontmatter, data: meta} = fm(mdxWithFrontmatter); |
|
|
|
|
|
|
|
// If we don't add these fake imports, the MDX compiler
|
|
|
|
// will insert a bunch of opaque components we can't introspect.
|
|
|
|
// This will break the prepareMDX() call below.
|
|
|
|
let mdxWithFakeImports = mdxComponentNames |
|
|
|
.map((key) => 'import ' + key + ' from "' + key + '";\n') |
|
|
|
.join('\n'); |
|
|
|
mdxWithFakeImports += '\n' + mdxWithoutFrontmatter; |
|
|
|
let mdxWithFakeImports = |
|
|
|
mdx + |
|
|
|
'\n' + |
|
|
|
mdxComponentNames |
|
|
|
.map((key) => 'import ' + key + ' from "' + key + '";\n') |
|
|
|
.join('\n'); |
|
|
|
|
|
|
|
// Turn the MDX we just read into some JS we can execute.
|
|
|
|
const {remarkPlugins} = require('../../plugins/markdownToHtml'); |
|
|
|
const {compile: compileMdx} = await import('@mdx-js/mdx'); |
|
|
|
const visit = (await import('unist-util-visit')).default; |
|
|
|
const jsxCode = await compileMdx(mdxWithFakeImports, { |
|
|
|
remarkPlugins: [...remarkPlugins, (await import('remark-gfm')).default], |
|
|
|
remarkPlugins: [ |
|
|
|
...remarkPlugins, |
|
|
|
(await import('remark-gfm')).default, |
|
|
|
(await import('remark-frontmatter')).default, |
|
|
|
], |
|
|
|
rehypePlugins: [ |
|
|
|
// Support stuff like ```js App.js {1-5} active by passing it through.
|
|
|
|
function rehypeMetaAsAttributes() { |
|
|
|
@ -169,6 +171,10 @@ export async function getStaticProps(context) { |
|
|
|
toc = []; |
|
|
|
} |
|
|
|
|
|
|
|
// Parse Frontmatter headers from MDX.
|
|
|
|
const fm = require('gray-matter'); |
|
|
|
const meta = fm(mdx).data; |
|
|
|
|
|
|
|
const output = { |
|
|
|
props: { |
|
|
|
content: JSON.stringify(children, stringifyNodeOnServer), |
|
|
|
|
dan
2 years ago
GitHub