基於 React 開發了一個 Markdown 文檔站點生成工具

Create React Doc 是一個使用 React 的 markdown 文檔站點生成工具。就像 create-react-app 同樣，開發者能夠使用 Create React Doc 來開發、部署 markdown 站點或者博客而不用關心站點環境配置信息。

特性

• 零配置書寫 markdown 文檔站點。
• markdown 文檔支持懶加載以及熱加載。
• 基於文件目錄自動生成多層級菜單。
• 支持一鍵發佈到 GitHub Pages.

使用 create-react-doc 搭建的文檔站點

• blog

快速上手

執行以下命令:

npx create-react-doc my-doc
npm install && cd my-doc
npm start
複製代碼

而後打開 http://localhost:3000/ 就能夠看到文檔站點。當準備發佈到生產環境時，執行 npm run build 就能將文檔站點打包壓縮。

使用

create-react-doc 很是容易上手。開發者不須要額外安裝或配置 webpack 或者 Babel 等工具，它們被內置隱藏在腳手架中，所以開發者能夠專心於文檔的書寫。

下面提供三種方式來快速建立文檔站點:

npx

npx create-react-doc my-doc
複製代碼

npm

npm init create-react-doc my-doc
複製代碼

yarn

yarn create create-react-doc my-doc
複製代碼

一旦安裝執行完畢，執行 npm install 而後進入項目文件夾:

npm install && cd my-doc
複製代碼

在新建立的項目中, 能夠執行內置的一些命令:

npm start or yarn start

在開發者模式下啓動文檔項目:

在瀏覽器中打開 http://localhost:3000 預覽站點。

若是站點文檔發生改變, 站點將自動從新加載。

npm run build or yarn build

將要發佈的文檔站點進行打包構建, 此時的文檔網站已準備好進行部署。

npm run deploy or yarn deploy

根據 config.yml 裏的 user 和 repo 參數, 文檔站點默認將會發布到 GitHub Pages

config.yml

能夠在站點根目錄中的 config.yml 文件夾 中進行配置站點的功能。

# Site title
title: Time Flying

# Point witch files to show as Menu
## you can also set detailed dir, such as BasicSkill/css
menu: React,BasicSkill,Algorithm
## set init open menu keys
menuOpenKeys: /BasicSkill

# Github
## if you want to show editing pages on github or deploy to GitHub Pages, you should config these arguments.
user: MuYunyun
repo: blog
branch: master            # the default value of branch is master
deploy_branch: gh-pages   # which branch to deploy.(default: gh-pages)
# publish: # if you want upload to gitlab or other git platform, you can set full git url in it

# Available values: en| zh-cn
language: en
複製代碼

高階用法

• 與 git 文件結構相似, 若是在展現的文件夾中有私有文件不方便展現在文檔站點, 能夠在 .gitignore 文件中設置過濾文件, 這樣它們就不會展現在文檔站點中了。eg: .gitignore
• 更多用法: 歡迎在 issue 留言。