VuePressのブログテーマ使ってみた。

このブログで既に使用しているのだが、簡単なうえにシンプルでなかなか良かったので紹介

# Markdownで書ける

何よりこれ、タイトル、Date、タグがMarkdown内でYAMLで書けるのはいいと思いました。

私が前に作ったブログ(opens new window) より何倍も良いと気付いてしまったので、VuePressのブログテーマを使用したものに切り替えました。

Vercelのビルドパイプラインに、ファイルの作成日と変更日を渡せないという理由で、記事やタグの作成日や変更日をGitのログから取得し、Markdownファイルに上書きするという工程が必要になり、かなりめんどくさいことになっていたので切り替えて良かったと思います。

# 設定とサイトのカスタマイズが簡単

config.jsで簡単に設定はできるし、stylesにCSS書くだけでサイトのデザインも簡単に変更できる。

さらには、コンポーネントの上書きもできますよね。

楽すぎる、良い...良いぞ

# RSSの配信

RSSの配信も簡単にできる。内部ではvuepress-plugin-feed(opens new window) を使用しているそうだ。

config.jsthemeConfigに下記のようにコードを追加することで、RSSの配信ができる。

module.exports = {
  themeConfig: {
    feed: {
      canonical_base: 'https://example/com'
    }
  }
}

# サイトマップの作成

サイトマップの作成も簡単にできる。内部ではvuepress-plugin-sitemap(opens new window) を使用しているそうだ。

config.jsthemeConfigに、下記のようなコードを追加するだけで、サイトマップの作成を行ってくれる。

module.exports = {
  themeConfig: {
    sitemap: {
      hostname: 'https://example.com'
    }
  }
}

# PWAへの対応

PWA (Progressive Web Application) への対応も非常に簡単

config.jsthemeConfigに、pwa: trueと追加するだけで、Service Workerを作成してくれる。

内部では公式の@vuepress/plugin-pwa(opens new window) を使用しているようだ。

module.exports = {
  themeConfig: {
    pwa: true
  }
}

# それ以外の機能

といったものがある。興味はあるが私が使うまでここでの説明はしないでおく