跳至主要内容

01. 準備步驟、相關環境

什麼是 Docusaurus?

Document(文件)+ saurus(恐龍)= Docusaurus 一直覺得這名字很難記,透過拆字希望能幫助記憶

Docusaurus 是由 Facebook 推出的開源靜態網站生成工具,以 React 技術構建,提供快速建置以文檔內容為核心的網站。

為什麼選擇 Docusaurus?

開頭有提到 Docusaurus 幾項特點,再參照官網說明後整理如下:

  • 支援 Markdown 擴充格式 MDX
  • 可在文檔中編寫 JSX 語法,並渲染為 React 的 component (元件)
  • 支援 i18n,可將文檔翻譯成 70 多種語言
  • 架設靜態網站 (HTML、CSS、JS)

環境

今天我們以較簡單入門的 Docusaurus 作為網站的基礎,讓沒學過 HTML 的人也可以輕鬆入門

首先要使用 Docusaurus 我們要先安裝相關環境:

Node.js版本 20.0 或以上:

進入網站後,下面選擇對應的作業系統安裝檔案:https://nodejs.org/en/download/

Windows / MacOS 的使用者一直按下一步即可完成安裝

建立一個新網站

接著打開系統內建的終端機,Windows 建議使用 PowerShell、Mac 就用 終端機

開啟終端機之後輸入:

cd 資料夾位置

這樣可以進入你要的資料夾

這裡 cd 的意思是:change dictionary

然後輸入:

npm init docusaurus@latest my-website classic

這個指令也會安裝執行 Docusaurus 所需的所有依賴。

尚未更新完成,慢慢來請等待,找資料需要時間