# VuePressに触れる

2022.5.31

さて、私はMisskey(厳密にはGroundpolisというMisskeyの派生)というSNSに参加している。このSNSのすごいところは、syuilo氏という日本人が開発されたオープンソースのプロジェクトであることだ。
このプロジェクトの公式ドキュメントサイト、MisskeyHub (opens new window)がVuePressで実装されていることを知り (opens new window)、使ってみようと思ったのだ。
本記事では、備忘録としてVuePressの使い方や自分が構築の際迷ったところをまとめていこうと思う。

# インストール

VuePressV1は、簡単なコマンドで秒で構築できる。

npx create-vuepress-site

これで基本的なインストールは完了。続いて、簡易的なビューを表示しよう。

cd docs
npm install

ちょっと時間がかかるので、けなげに待つこと。

npm run dev

これで、簡易的なプレビューが見られる。ちなみに、変更内容を保存していくたびに自動でプレビューを更新してくれる。

# ソースコード

config.js下

logo 左上に画像を置くことができる。

logo: '任意の画像URL',

下で移動したい

sidebar: {
      '/blog/': [
        {
          title: 'Blog',
          collapsable: false,
          children: [
            '',
            'using-vue',
          ]
        }
      ],
    }

眠い →