From e03644bfec4b5bcf5cd8aae9eca1824ac96e8055 Mon Sep 17 00:00:00 2001 From: endiliey Date: Mon, 13 May 2019 11:20:45 +0800 Subject: [PATCH 1/5] refactor. Don't confuse metadata & frontmatter --- .../src/metadata.js | 48 +++++++++---------- 1 file changed, 22 insertions(+), 26 deletions(-) diff --git a/packages/docusaurus-plugin-content-docs/src/metadata.js b/packages/docusaurus-plugin-content-docs/src/metadata.js index a8a489c209e6..cfc6c046f287 100644 --- a/packages/docusaurus-plugin-content-docs/src/metadata.js +++ b/packages/docusaurus-plugin-content-docs/src/metadata.js @@ -18,70 +18,66 @@ module.exports = async function processMetadata( ) { const filepath = path.resolve(refDir, source); const fileString = await fs.readFile(filepath, 'utf-8'); - const {frontMatter = {}, excerpt} = parse(fileString); + const {frontMatter: metadata = {}, excerpt} = parse(fileString); // Default id is the file name. - if (!frontMatter.id) { - frontMatter.id = path.basename(source, path.extname(source)); + if (!metadata.id) { + metadata.id = path.basename(source, path.extname(source)); } - if (frontMatter.id.includes('/')) { + if (metadata.id.includes('/')) { throw new Error('Document id cannot include "/".'); } // Default title is the id. - if (!frontMatter.title) { - frontMatter.title = frontMatter.id; + if (!metadata.title) { + metadata.title = metadata.id; } - if (!frontMatter.description) { - frontMatter.description = excerpt; + if (!metadata.description) { + metadata.description = excerpt; } const dirName = path.dirname(source); if (dirName !== '.') { const prefix = dirName; if (prefix) { - frontMatter.id = `${prefix}/${frontMatter.id}`; + metadata.id = `${prefix}/${metadata.id}`; } } // The docs absolute file source. // e.g: `/end/docs/hello.md` or `/end/website/versioned_docs/version-1.0.0/hello.md` - frontMatter.source = path.join(refDir, source); + metadata.source = path.join(refDir, source); // Build the permalink. const {baseUrl} = siteConfig; // If user has own custom permalink defined in frontmatter // e.g: :baseUrl:docsUrl/:langPart/:versionPart/endiliey/:id - if (frontMatter.permalink) { - frontMatter.permalink = path.resolve( - frontMatter.permalink + if (metadata.permalink) { + metadata.permalink = path.resolve( + metadata.permalink .replace(/:baseUrl/, baseUrl) .replace(/:docsUrl/, docsBasePath) - .replace(/:id/, frontMatter.id), + .replace(/:id/, metadata.id), ); } else { - frontMatter.permalink = normalizeUrl([ - baseUrl, - docsBasePath, - frontMatter.id, - ]); + metadata.permalink = normalizeUrl([baseUrl, docsBasePath, metadata.id]); } // Determine order. - const {id} = frontMatter; + const {id} = metadata; if (order[id]) { - frontMatter.sidebar = order[id].sidebar; - frontMatter.category = order[id].category; - frontMatter.subCategory = order[id].subCategory; + metadata.sidebar = order[id].sidebar; + metadata.category = order[id].category; + metadata.subCategory = order[id].subCategory; if (order[id].next) { - frontMatter.next = order[id].next; + metadata.next = order[id].next; } if (order[id].previous) { - frontMatter.previous = order[id].previous; + metadata.previous = order[id].previous; } } - return frontMatter; + return metadata; }; From fabee36ede167c91701fd77bfce1026b2dcca04e Mon Sep 17 00:00:00 2001 From: endiliey Date: Mon, 13 May 2019 14:09:34 +0800 Subject: [PATCH 2/5] export frontMatter in content itself --- packages/docusaurus-mdx-loader/package.json | 1 + packages/docusaurus-mdx-loader/src/index.js | 6 ++- .../src/index.js | 52 +++++-------------- .../src/markdownLoader.js | 19 +++---- .../src/theme/BlogListPage/index.js | 8 +-- .../src/theme/BlogPostPage/index.js | 12 ++--- .../src/theme/BlogPostPaginator/index.js | 12 ++--- .../package.json | 1 - .../src/markdown/index.js | 6 +-- 9 files changed, 41 insertions(+), 76 deletions(-) diff --git a/packages/docusaurus-mdx-loader/package.json b/packages/docusaurus-mdx-loader/package.json index ac38ec259396..5b79213573cb 100644 --- a/packages/docusaurus-mdx-loader/package.json +++ b/packages/docusaurus-mdx-loader/package.json @@ -14,6 +14,7 @@ "@mdx-js/mdx": "^1.0.18", "@mdx-js/react": "^1.0.16", "github-slugger": "^1.2.1", + "gray-matter": "^4.0.2", "loader-utils": "^1.2.3", "mdast-util-to-string": "^1.0.5", "prism-themes": "^1.1.0", diff --git a/packages/docusaurus-mdx-loader/src/index.js b/packages/docusaurus-mdx-loader/src/index.js index ca4cbaad9044..5ef88095bcdc 100644 --- a/packages/docusaurus-mdx-loader/src/index.js +++ b/packages/docusaurus-mdx-loader/src/index.js @@ -10,6 +10,8 @@ const mdx = require('@mdx-js/mdx'); const rehypePrism = require('@mapbox/rehype-prism'); const emoji = require('remark-emoji'); const slug = require('rehype-slug'); +const matter = require('gray-matter'); +const stringifyObject = require('stringify-object'); const linkHeadings = require('./linkHeadings'); const rightToc = require('./rightToc'); @@ -19,9 +21,10 @@ const DEFAULT_OPTIONS = { prismTheme: 'prism-themes/themes/prism-atom-dark.css', }; -module.exports = async function(content) { +module.exports = async function(fileString) { const callback = this.async(); + const {data = {}, content} = matter(fileString); const options = Object.assign(DEFAULT_OPTIONS, getOptions(this), { filepath: this.resourcePath, }); @@ -42,6 +45,7 @@ module.exports = async function(content) { const code = ` import React from 'react'; import { mdx } from '@mdx-js/react'; + export const frontMatter = ${stringifyObject(data)} ${importStr} ${result} `; diff --git a/packages/docusaurus-plugin-content-blog/src/index.js b/packages/docusaurus-plugin-content-blog/src/index.js index 77d59e62ea31..fcae3c983347 100644 --- a/packages/docusaurus-plugin-content-blog/src/index.js +++ b/packages/docusaurus-plugin-content-blog/src/index.js @@ -74,7 +74,7 @@ class DocusaurusPluginContentBlog { ); const fileString = await fs.readFile(source, 'utf-8'); - const {frontMatter, excerpt: description} = parse(fileString); + const {frontMatter, excerpt} = parse(fileString); blogPosts.push({ id: blogFileName, @@ -85,10 +85,10 @@ class DocusaurusPluginContentBlog { fileToUrl(blogFileName), ]), source, - description, + description: frontMatter.description || excerpt, date, + title: frontMatter.title || blogFileName, }, - frontMatter, }); }), ); @@ -141,21 +141,13 @@ class DocusaurusPluginContentBlog { // Create routes for blog entries. const blogItems = await Promise.all( blogPosts.map(async blogPost => { - const {id, frontMatter, metadata} = blogPost; + const {id, metadata} = blogPost; const {permalink} = metadata; - const [frontMatterPath, metadataPath] = await Promise.all([ - createData( - `${docuHash(`${permalink}-frontmatter`)}.json`, - JSON.stringify(frontMatter, null, 2), - ), - createData( - `${docuHash(`${permalink}-metadata`)}.json`, - JSON.stringify(metadata, null, 2), - ), - ]); + const metadataPath = await createData( + `${docuHash(`${permalink}-metadata`)}.json`, + JSON.stringify(metadata, null, 2), + ); const temp = { - frontMatter, - frontMatterPath, metadata, metadataPath, }; @@ -169,7 +161,7 @@ class DocusaurusPluginContentBlog { const prevItem = index > 0 ? blogItems[index - 1] : null; const nextItem = index < blogItems.length - 1 ? blogItems[index + 1] : null; - const {frontMatterPath, metadata, metadataPath} = blogItem; + const {metadata, metadataPath} = blogItem; const {source, permalink} = metadata; addRoute({ @@ -178,22 +170,9 @@ class DocusaurusPluginContentBlog { exact: true, modules: { content: source, - frontMatter: frontMatterPath, metadata: metadataPath, - prevItem: - prevItem != null - ? { - metadata: prevItem.metadataPath, - frontMatter: prevItem.frontMatterPath, - } - : null, - nextItem: - nextItem != null - ? { - metadata: nextItem.metadataPath, - frontMatter: nextItem.frontMatterPath, - } - : null, + prevItem: prevItem && prevItem.metadataPath, + nextItem: nextItem && nextItem.metadataPath, }, }); }); @@ -214,11 +193,9 @@ class DocusaurusPluginContentBlog { exact: true, modules: { items: items.map(postID => { - const { - frontMatterPath, - metadata: postMetadata, - metadataPath, - } = blogItemsToModules[postID]; + const {metadata: postMetadata, metadataPath} = blogItemsToModules[ + postID + ]; // To tell routes.js this is an import and not a nested object to recurse. return { content: { @@ -229,7 +206,6 @@ class DocusaurusPluginContentBlog { }, }, metadata: metadataPath, - frontMatter: frontMatterPath, }; }), metadata: pageMetadataPath, diff --git a/packages/docusaurus-plugin-content-blog/src/markdownLoader.js b/packages/docusaurus-plugin-content-blog/src/markdownLoader.js index a9385ed43062..a4ed29e8d092 100644 --- a/packages/docusaurus-plugin-content-blog/src/markdownLoader.js +++ b/packages/docusaurus-plugin-content-blog/src/markdownLoader.js @@ -13,22 +13,23 @@ const TRUNCATE_MARKER = //; module.exports = async function(fileString) { const callback = this.async(); - // Extract content of markdown (without frontmatter). - let {content} = matter(fileString); + let finalContent = fileString; // Truncate content if requested (e.g: file.md?truncated=true) const {truncated} = this.resourceQuery && parseQuery(this.resourceQuery); if (truncated) { - if (TRUNCATE_MARKER.test(content)) { + if (TRUNCATE_MARKER.test(fileString)) { // eslint-disable-next-line - content = content.split(TRUNCATE_MARKER)[0]; + finalContent = fileString.split(TRUNCATE_MARKER)[0]; } else { - // Return first 4 lines of the content as summary - content = content - .split('\n') - .slice(0, 4) + // Only use the first 4 lines of the content (not the frontmatter) + const {data, content} = matter(fileString); + const truncatedContent = content + .trim() + .split('\n', 4) .join('\n'); + finalContent = matter.stringify(truncatedContent, data); } } - return callback(null, content); + return callback(null, finalContent); }; diff --git a/packages/docusaurus-plugin-content-blog/src/theme/BlogListPage/index.js b/packages/docusaurus-plugin-content-blog/src/theme/BlogListPage/index.js index 969e2b0e3809..9e114bd1cb46 100644 --- a/packages/docusaurus-plugin-content-blog/src/theme/BlogListPage/index.js +++ b/packages/docusaurus-plugin-content-blog/src/theme/BlogListPage/index.js @@ -20,16 +20,12 @@ function BlogListPage(props) {
{items.map( - ({ - content: BlogPostContent, - frontMatter, - metadata: blogPostMetadata, - }) => ( + ({content: BlogPostContent, metadata: blogPostMetadata}) => (
diff --git a/packages/docusaurus-plugin-content-blog/src/theme/BlogPostPage/index.js b/packages/docusaurus-plugin-content-blog/src/theme/BlogPostPage/index.js index 11569b862aac..ff2fc1868937 100644 --- a/packages/docusaurus-plugin-content-blog/src/theme/BlogPostPage/index.js +++ b/packages/docusaurus-plugin-content-blog/src/theme/BlogPostPage/index.js @@ -12,16 +12,10 @@ import BlogPostItem from '@theme/BlogPostItem'; import BlogPostPaginator from '../BlogPostPaginator'; function BlogPostPage(props) { - const { - content: BlogPostContents, - frontMatter, - metadata, - nextItem, - prevItem, - } = props; - console.log(props); + const {content: BlogPostContents, metadata, nextItem, prevItem} = props; + const {frontMatter} = BlogPostContents; return ( - + {BlogPostContents && (
diff --git a/packages/docusaurus-plugin-content-blog/src/theme/BlogPostPaginator/index.js b/packages/docusaurus-plugin-content-blog/src/theme/BlogPostPaginator/index.js index 54cefdce726f..56643ab322b8 100644 --- a/packages/docusaurus-plugin-content-blog/src/theme/BlogPostPaginator/index.js +++ b/packages/docusaurus-plugin-content-blog/src/theme/BlogPostPaginator/index.js @@ -15,19 +15,15 @@ function BlogPostPaginator(props) {
{prevItem && ( - - {prevItem.frontMatter.title} + + {prevItem.title} )}
{nextItem && ( - - {nextItem.frontMatter.title} + + {nextItem.title} )}
diff --git a/packages/docusaurus-plugin-content-docs/package.json b/packages/docusaurus-plugin-content-docs/package.json index 336a80bc2914..1a19a7b574cb 100644 --- a/packages/docusaurus-plugin-content-docs/package.json +++ b/packages/docusaurus-plugin-content-docs/package.json @@ -13,7 +13,6 @@ "@docusaurus/utils": "^2.0.0-alpha.13", "fs-extra": "^7.0.1", "globby": "^9.1.0", - "gray-matter": "^4.0.2", "import-fresh": "^3.0.0", "loader-utils": "^1.2.3" }, diff --git a/packages/docusaurus-plugin-content-docs/src/markdown/index.js b/packages/docusaurus-plugin-content-docs/src/markdown/index.js index 30b55aab616e..7f2d88c25698 100644 --- a/packages/docusaurus-plugin-content-docs/src/markdown/index.js +++ b/packages/docusaurus-plugin-content-docs/src/markdown/index.js @@ -5,7 +5,6 @@ * LICENSE file in the root directory of this source tree. */ -const matter = require('gray-matter'); const {getOptions} = require('loader-utils'); const {resolve} = require('url'); @@ -16,9 +15,6 @@ module.exports = async function(fileString) { }); const {docsDir, sourceToPermalink} = options; - // Extract content of markdown (without frontmatter). - let {content} = matter(fileString); - // Determine the source dir. e.g: /docs, /website/versioned_docs/version-1.0.0 let sourceDir; const thisSource = this.resourcePath; @@ -26,6 +22,8 @@ module.exports = async function(fileString) { sourceDir = docsDir; } + let content = fileString; + // Replace internal markdown linking (except in fenced blocks). if (sourceDir) { let fencedBlock = false; From e042ccfa6abe9b8edbde258b3b5e12d038c8743b Mon Sep 17 00:00:00 2001 From: endiliey Date: Mon, 13 May 2019 14:14:13 +0800 Subject: [PATCH 3/5] nits --- packages/docusaurus-mdx-loader/src/index.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/docusaurus-mdx-loader/src/index.js b/packages/docusaurus-mdx-loader/src/index.js index 5ef88095bcdc..48ffa7305924 100644 --- a/packages/docusaurus-mdx-loader/src/index.js +++ b/packages/docusaurus-mdx-loader/src/index.js @@ -24,7 +24,7 @@ const DEFAULT_OPTIONS = { module.exports = async function(fileString) { const callback = this.async(); - const {data = {}, content} = matter(fileString); + const {data, content} = matter(fileString); const options = Object.assign(DEFAULT_OPTIONS, getOptions(this), { filepath: this.resourcePath, }); @@ -45,8 +45,8 @@ module.exports = async function(fileString) { const code = ` import React from 'react'; import { mdx } from '@mdx-js/react'; - export const frontMatter = ${stringifyObject(data)} ${importStr} + export const frontMatter = ${stringifyObject(data)}; ${result} `; From 559618d1ba86fa7b96a1fdf82e86aa954c95b98e Mon Sep 17 00:00:00 2001 From: endiliey Date: Mon, 13 May 2019 14:40:00 +0800 Subject: [PATCH 4/5] nits name --- packages/docusaurus-plugin-content-blog/src/index.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/docusaurus-plugin-content-blog/src/index.js b/packages/docusaurus-plugin-content-blog/src/index.js index fcae3c983347..25f377c5e9c6 100644 --- a/packages/docusaurus-plugin-content-blog/src/index.js +++ b/packages/docusaurus-plugin-content-blog/src/index.js @@ -144,7 +144,7 @@ class DocusaurusPluginContentBlog { const {id, metadata} = blogPost; const {permalink} = metadata; const metadataPath = await createData( - `${docuHash(`${permalink}-metadata`)}.json`, + `${docuHash(permalink)}.json`, JSON.stringify(metadata, null, 2), ); const temp = { @@ -183,7 +183,7 @@ class DocusaurusPluginContentBlog { const {metadata, items} = listPage; const {permalink} = metadata; const pageMetadataPath = await createData( - `${docuHash(`${permalink}-metadata`)}.json`, + `${docuHash(permalink)}.json`, JSON.stringify(metadata, null, 2), ); From d80cf3d4c949fc48d25589f7a962d28ed82f79b5 Mon Sep 17 00:00:00 2001 From: endiliey Date: Mon, 13 May 2019 15:04:50 +0800 Subject: [PATCH 5/5] dont truncate first four lines in blog --- .../docusaurus-plugin-content-blog/package.json | 1 - .../src/markdownLoader.js | 17 +++-------------- .../2018-12-14-Happy-First-Birthday-Slash.md | 2 ++ 3 files changed, 5 insertions(+), 15 deletions(-) diff --git a/packages/docusaurus-plugin-content-blog/package.json b/packages/docusaurus-plugin-content-blog/package.json index 60e03eea889c..9811f2373ff1 100644 --- a/packages/docusaurus-plugin-content-blog/package.json +++ b/packages/docusaurus-plugin-content-blog/package.json @@ -12,7 +12,6 @@ "@docusaurus/utils": "^2.0.0-alpha.13", "fs-extra": "^7.0.1", "globby": "^9.1.0", - "gray-matter": "^4.0.2", "loader-utils": "^1.2.3" }, "peerDependencies": { diff --git a/packages/docusaurus-plugin-content-blog/src/markdownLoader.js b/packages/docusaurus-plugin-content-blog/src/markdownLoader.js index a4ed29e8d092..e7b7577d5f5b 100644 --- a/packages/docusaurus-plugin-content-blog/src/markdownLoader.js +++ b/packages/docusaurus-plugin-content-blog/src/markdownLoader.js @@ -5,7 +5,6 @@ * LICENSE file in the root directory of this source tree. */ -const matter = require('gray-matter'); const {parseQuery} = require('loader-utils'); const TRUNCATE_MARKER = //; @@ -17,19 +16,9 @@ module.exports = async function(fileString) { // Truncate content if requested (e.g: file.md?truncated=true) const {truncated} = this.resourceQuery && parseQuery(this.resourceQuery); - if (truncated) { - if (TRUNCATE_MARKER.test(fileString)) { - // eslint-disable-next-line - finalContent = fileString.split(TRUNCATE_MARKER)[0]; - } else { - // Only use the first 4 lines of the content (not the frontmatter) - const {data, content} = matter(fileString); - const truncatedContent = content - .trim() - .split('\n', 4) - .join('\n'); - finalContent = matter.stringify(truncatedContent, data); - } + if (truncated && TRUNCATE_MARKER.test(fileString)) { + // eslint-disable-next-line + finalContent = fileString.split(TRUNCATE_MARKER)[0]; } return callback(null, finalContent); }; diff --git a/website-1.x/blog/2018-12-14-Happy-First-Birthday-Slash.md b/website-1.x/blog/2018-12-14-Happy-First-Birthday-Slash.md index e20732b9c103..06366432b788 100644 --- a/website-1.x/blog/2018-12-14-Happy-First-Birthday-Slash.md +++ b/website-1.x/blog/2018-12-14-Happy-First-Birthday-Slash.md @@ -11,6 +11,8 @@ authorTwitter: JoelMarcey Docusaurus [went live](https://docusaurus.io/blog/2017/12/14/introducing-docusaurus) on December 14, 2017. At the time, we had [8 early adopters](https://docusaurus.io/blog/2017/12/14/introducing-docusaurus#acknowledgements). + + We now have nearly [60 known users of Docusaurus](https://docusaurus.io/en/users), and probably more that we don't know about. We have [9K GitHub stars](https://github.com/facebook/docusaurus) and an active community, particularly [Yangshun Tay](https://twitter.com/yangshunz) and [Endilie Yacop Sucipto](https://twitter.com/endiliey), both of whom are the lead maintainers helping keep this project [moving forward](https://docusaurus.io/blog/2018/09/11/Towards-Docusaurus-2). Thank you to everyone for your support and use of this project! I am super proud of how far this project has come in just a year.