国产成人精品无码青草_亚洲国产美女精品久久久久∴_欧美人与鲁交大毛片免费_国产果冻豆传媒麻婆精东

15158846557 在線咨詢 在線咨詢
15158846557 在線咨詢
所在位置: 首頁 > 營銷資訊 > 網(wǎng)站運(yùn)營 > AntdSite - 一個(gè)基于React.Js的靜態(tài)網(wǎng)站生成器

AntdSite - 一個(gè)基于React.Js的靜態(tài)網(wǎng)站生成器

時(shí)間:2023-07-21 11:21:01 | 來源:網(wǎng)站運(yùn)營

時(shí)間:2023-07-21 11:21:01 來源:網(wǎng)站運(yùn)營

AntdSite - 一個(gè)基于React.Js的靜態(tài)網(wǎng)站生成器:

前言

簡介

由來

以前我是vuepress的用戶,在開發(fā) vue 組件中使用它來寫文檔感覺非常順手。 后來我開始研究上了 react,開發(fā) react 組件就得有文檔呀,我在這期間陸續(xù)試了幾個(gè)基于 react 的文檔生成器,像docz, docusaurus . 但是試用了下,感覺都不如 vuepree 順手。后來,我訪問Ant Design官網(wǎng)的時(shí)候突然冒出來一個(gè)想法: 把Ant Design官網(wǎng)做成可配置可以嗎? 答案是可以的。于是,antdsite就誕生了。

總的來說就是:

特點(diǎn)

快速開始

安裝

使用 cli 快速初始化一個(gè)項(xiàng)目

yarn global add antdsite-cli# 或者如果你使用 npmnpm i antdsite-cli -g

用法

使用命令行工具antdsite-cli初始化項(xiàng)目

antdsite my-docs然后訪問本地8000端口就可以啦,具體可以參考官網(wǎng)的快速上手.

截圖







在markdown里面使用 Ant Design

兩種方法使用 Ant Design

直接在 markdown 中導(dǎo)入 antd 組件

import { Button } from 'antd';<Button />;參考鏈接和 demo:使用 antd

設(shè)置 antd 為全局組件

可以在 globalComponent.js 中設(shè)置全局組件,這樣可以不用在 markdown 中頻繁導(dǎo)入 antd 就能直接使用它的 UI 組件了。

// .antdsite/globalComponent.jsimport { Button } from 'antd';export default { Button};直接在 markdown 中使用Button

<Button />參考鏈接和 demo:全局組件

關(guān)于 gatsby

antdsite 涉及 gatsby 還是很少的,具體只包括:

// gatsby-config.jsmodule.exports = { __experimentalThemes: ['antdsite']};

常見問題

這個(gè)和 vuepress 配置完全一樣的嗎?
大部分是模仿的 vuepress 的配置的,但也有一些不同。比如配置中沒有自定義端口,地址,PWA 等。 那些需要配置Gatsby的,交給 AntdSite 反而更加繁瑣。

我不會(huì) react 可以使用嗎?
完全可以。上手的要是是僅僅是 markdown 基礎(chǔ)知識(shí)和一點(diǎn) js 知識(shí)。

可以將自定義主題做成插件形式發(fā)布到 npm 上嗎?
這個(gè)暫時(shí)不可以,不過未來可以考慮加入這個(gè)功能。

如果還有問題可以留言一起討論~

寫在最后

希望大家能踴躍嘗試,有好的意見和建議可以反饋給我

關(guān)鍵詞:靜態(tài),成器

74
73
25
news

版權(quán)所有? 億企邦 1997-2025 保留一切法律許可權(quán)利。

為了最佳展示效果,本站不支持IE9及以下版本的瀏覽器,建議您使用谷歌Chrome瀏覽器。 點(diǎn)擊下載Chrome瀏覽器
關(guān)閉