Docusaurusのインストール方法

この記事では、Docusaurus のはじめ方を説明します。

環境構築

公式Docには、必要要件として以下が挙げられています。

Node.js version 16.14 or above

私はDockerでこの環境を構築しました。Dockerfileなどを以下に示します。

Dockerfile

FROM node:20.4.0-slim

# 必要なパッケージのインストール
RUN apt-get update \
    && apt-get upgrade -y \
    && apt install -y git curl

RUN apt install -y npm

# ｎをインストール
RUN npm install -g n

# 最新のLTS版を指定
RUN n lts

# package インストール
RUN yarn

docker-compose.yml

version: '3'

services:
  docusaurus-dev:
    build: 
      context: .
      dockerfile: Dockerfile
    container_name: docusaurus-dev
    image: docusaurus-dev
    volumes: 
      - $PWD:/workspace
    working_dir: /workspace
    tty: true
    command: /bin/bash

プロジェクトを作る

以下の手順でコマンドを実行し、新たにページを作成->起動します。

新たにプロジェクトを作成する。

npx create-docusaurus@latest <project_name> classic

<project_name>ディレクトリへ移動する。
```
cd <project_name>
```
起動する。
```
yarn start
```
表示されたURLにアクセスしてみる。私の環境ではlocalhost:3000にアクセスすることで、作成されたページにアクセスすることができました。

ページの設定をする

まず、docusaurus.config.jsを編集して、ページの設定をすると良いでしょう。差し当たって、設定した方が良さそうだと思うパラメータを以下に示します。

ページのメタ情報
- title : ページタイトル
- tagline : キャッチフレーズ
- favicon : faviconのパス
- url : デプロイする際のホスト名
- baseUrl : サイトが提供されるルートURL (例: ＜url＞/＜baseUrl＞)
- defaultLocation : デフォルトの言語設定
- locations : 対応する言語リスト
ヘッダー・フッターの設定

Docusaurusのインストール方法

環境構築​

プロジェクトを作る​

ページの設定をする​

参考文献​

環境構築

プロジェクトを作る

ページの設定をする

参考文献