資訊專欄INFORMATION COLUMN
摘要：前言簡介是一個基于的靜態網站生成器。后來我開始研究上了，開發組件就得有文檔呀，我在這期間陸續試了幾個基于的文檔生成器，像但是試用了下，感覺都不如順手。于是，就誕生了。文檔的界面設計來源于的官網。
前言 簡介
Antdsite 是一個基于 React.js 的靜態網站生成器。
它是由Gatsby Js驅動的
使用 Ant Design設計構建， 并且它的配置項借鑒了Vuepress
由來以前我是vuepress的用戶，在開發 vue 組件中使用它來寫文檔感覺非常順手。 后來我開始研究上了 react，開發 react 組件就得有文檔呀，我在這期間陸續試了幾個基于 react 的文檔生成器，像docz, docusaurus . 但是試用了下，感覺都不如 vuepree 順手。后來，我訪問Ant Design官網的時候突然冒出來一個想法： 把Ant Design官網做成可配置可以嗎？ 答案是可以的。于是，antdsite就誕生了。
總的來說就是：
文檔的配置模仿了 vuepress 的配置。
文檔的界面設計來源于 Ant Design 的官網。
說白了就是 Ant Design 官網，我給它改成可配置的了，并且讓它功能更強大！
特點Vuepree 配置風格，使用起來功能強大，簡單方便。
支持mdx.
內置了 Ant Design.
支持custom layout(例如自定義網站頭部，底部， 首頁等等).
快速開始 安裝使用 cli 快速初始化一個項目
yarn global add antdsite-cli # 或者如果你使用 npm npm i antdsite-cli -g用法
使用命令行工具antdsite-cli初始化項目
antdsite my-docs
然后訪問本地8000端口就可以啦,具體可以參考官網的快速上手.
截圖 在markdown里面使用 Ant Design兩種方法使用 Ant Design
直接在 markdown 中導入 antd 組件import { Button } from "antd";
;
參考鏈接和 demo：使用 antd
設置 antd 為全局組件可以在 globalComponent.js 中設置全局組件，這樣可以不用在 markdown 中頻繁導入 antd 就能直接使用它的 UI 組件了。
// .antdsite/globalComponent.js
import { Button } from "antd";
export default {
Button
};
直接在 markdown 中使用Button
參考鏈接和 demo：全局組件
關于 gatsbyantdsite 涉及 gatsby 還是很少的，具體只包括：
打包命令，運行命令：gatsby build gatsby develop
在 gatsby-config 里設置主題為antdsite
// gatsby-config.js
module.exports = {
__experimentalThemes: ["antdsite"]
};
在設置了base的情況下，打包命令加上--prefix-paths參數 gatsby build --prefix-paths
常見問題這個和 vuepress 配置完全一樣的嗎？
大部分是模仿的 vuepress 的配置的，但也有一些不同。比如配置中沒有自定義端口，地址,PWA 等。 那些需要配置Gatsby的，交給 AntdSite 反而更加繁瑣。
我不會 react 可以使用嗎？
完全可以。上手的要是是僅僅是 markdown 基礎知識和一點 js 知識。
可以將自定義主題做成插件形式發布到 npm 上嗎？
這個暫時不可以，不過未來可以考慮加入這個功能。
如果還有問題可以留言一起討論～
寫在最后希望大家能踴躍嘗試，有好的意見和建議可以反饋給我
github 地址
官網
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/106386.html
摘要：它不僅從前端移動到后端，我們也開始看到它用于機器學習和增強現實，簡稱。由于其高使用率，年的現狀調查將其稱為采用的安全技術。機器學習框架在年的開發者峰會上，宣布了他們的機器學習框架的實現，稱為。更高級別的用于在之上構建機器學習模型。 2019，開發者應該學習的16個JavaScript框架 showImg(https://segmentfault.com/img/remote/14600...
摘要：基于路由的異步組件加載本文章是一個額外的篇章，它可以在你的中，幫助加快初始的加載組件時間。但是，我們靜態地在頂部導入路由中的所有組件。當然我們的程序是相當小的，并且分離在各個部分的小組件，是不需要這樣子按需加載的。 基于 Create React App路由4.0的異步組件加載 本文章是一個額外的篇章，它可以在你的React app中，幫助加快初始的加載組件時間。當然這個操作不是完全必...
摘要：特意對前端學習資源做一個匯總，方便自己學習查閱參考，和好友們共同進步。 特意對前端學習資源做一個匯總，方便自己學習查閱參考，和好友們共同進步。 本以為自己收藏的站點多，可以很快搞定，沒想到一入匯總深似海。還有很多不足&遺漏的地方，歡迎補充。有錯誤的地方，還請斧正... 托管: welcome to git，歡迎交流，感謝star 有好友反應和斧正，會及時更新，平時業務工作時也會不定期更...
摘要：雅虎從很早就開始招聘和培養研究型人才，雅虎研究院就是在這個過程中應運而生的。今天我就來說一說雅虎研究院的歷史，以及過去十多年間取得的成就，聊一聊如何通過引進高級人才，迅速構建起一支世界級的研發團隊。 showImg(https://segmentfault.com/img/remote/1460000013995512); 作者：王下邀月熊 編輯：徐川 前端每周清單專注大前端領域內容，...
閱讀 634·2021-09-22 10:02
閱讀 6326·2021-09-03 10:49
閱讀 565·2021-09-02 09:47
閱讀 2151·2019-08-30 15:53
閱讀 2929·2019-08-30 15:44
閱讀 900·2019-08-30 13:20
閱讀 1812·2019-08-29 16:32
閱讀 889·2019-08-29 12:46
