ブログサイトを VitePress へ移行した

import { createContentLoader } from 'vitepress'

export default createContentLoader('content/posts/**/*.md', {
    includeSrc: false,
    transform(rawData) {
        return rawData
            .filter(page => page.url != "/content/posts/index")
            .sort((a, b) => {
                // date DESC
                return +new Date(b.frontmatter.date) - +new Date(a.frontmatter.date)
            })
            .map(page => {
                page.relativePath = page.url.replace(/^\/content\/posts\/[0-9]+\/[0-9]+\//g, 'posts/') + ".md";
                page.url = page.url.replace(/^\/content\/posts\/[0-9]+\/[0-9]+\//g, '/posts/').replace(/index$/g, '');
                return page;
            })
      }
})

import { h } from 'vue'
import DefaultTheme from 'vitepress/theme'
import PostTitle from './PostTitle.vue'
import PostFooter from './PostFooter.vue'
import { useData } from 'vitepress'
import './custom.css'

import { defineConfig } from 'vitepress'

export default defineConfig({
  title: "nshmura.com",
  description: "バックエンドエンジニアのメモ",
  lang: "ja",
  cleanUrls: true,
  srcDir: './content',
  themeConfig: {
    nav: [
      { text: 'Home', link: '/' },
      { text: 'About', link: '/about/' }
    ],

    sidebar: [
      {
        items: [
          { text: 'Home', link: '/' },
          { text: 'About', link: '/about/' },
          { text: 'Posts', link: '/posts/' },
          { text: 'Tags', link: '/tags/' }
        ]
      }
    ],

    socialLinks: [
      { icon: 'github', link: 'https://github.com/nshmura' }
    ],

    footer: {
      message: 'Released under the MIT License.',
      copyright: 'Copyright © present nshmura'
    }
  }
})

import fs from 'fs'
import { globSync } from 'glob'

var tags = {}

var files = globSync('content/posts/**/*.md');

files.forEach(file => {
  var data = fs.readFileSync(file, 'utf8');
  var found = data.match(/^tags:\s*\[(.+)\]\s*$/m)
  if (found) {
    found[1].split(",")
      .map(tag => { return tag.replaceAll('"', '') })
      .forEach(tag => {
      tags[tag.replaceAll(' ', '')] = tag
    })
  }
});

export default {
  paths: () => {
      return Object.keys(tags).map((key) => {
        return { params: { tag: key }, content: `# ${tags[key]}`}
      })
  }
}

import { h } from 'vue'
import DefaultTheme from 'vitepress/theme'
import PostTitle from './PostTitle.vue'
import PostFooter from './PostFooter.vue'
import { useData } from 'vitepress'
import './custom.css'

export default {
  extends: DefaultTheme,
  Layout() {
    return h(DefaultTheme.Layout, null, {
      'doc-before': () => {
        const { page } = useData()
        if (page.value.relativePath.match(/^posts\/(?!index.md)/)) {
          return h(PostTitle)
        }
      },
      'doc-after': () => {
        const { page } = useData()
        if (page.value.relativePath.match(/^posts\/(?!index.md)/)) {
          return h(PostFooter)
        }
      }      
    })
  }
}

import { computed } from 'vue'
import { data as posts } from './posts.data.js'
import { useData } from 'vitepress'

export function usePrevNext() {

  return computed(() => {

    const { page } = useData()

    var prev = null
    var next = null

    for (let i = 0; i < posts.length; ++i) {
      if (posts[i].relativePath == page.value.relativePath) {
        if (i >= 1) {
          next = posts[i - 1];
        }
        if (i <= posts.length - 2) {
          prev = posts[i + 1];
        }
        break;
      }
    }

    return {
      prev: {
        text: prev?.frontmatter.title,
        link: prev?.url
      },
      next: {
        text: next?.frontmatter.title,
        link: next?.url
      }
    }
  })
}

import { computed } from 'vue'
import { data as posts } from './posts.data.js'
import { useData } from 'vitepress'

export function usePickup() {

  return computed(() => {

    const { page } = useData()

    return posts
      .map(value => ({ value, sort: Math.random() }))
      .sort((a, b) => a.sort - b.sort)
      .map(({ value }) => value)
      .filter(post => post.relativePath != page.value.relativePath)
      .slice(0, 5);
  })
}

import { defineConfig } from 'vitepress'

export default defineConfig({
  ...
  rewrites: {
    'posts/(.*)/(.*)/:name/(.*)': 'posts/:name/index.md'
  },
  ...
})

import { defineConfig } from 'vitepress'

import { createWriteStream } from 'node:fs'
import { resolve } from 'node:path'
import { SitemapStream } from 'sitemap'

const links = []

export default defineConfig({
  ... 
  transformHtml: (_, id, { pageData }) => {
    // for sitemap
    if (!/[\\/]404\.html$/.test(id)) {
      links.push({
        url: pageData.relativePath.replace(/((^|\/)index)?\.md$/, '$2'),
        lastmod: pageData.frontmatter.date
      })
    }
    }
  },
  buildEnd: ({ outDir }) => {
    // sitemap
    const sitemap = new SitemapStream({ hostname: 'https://nshmura.com/' })
    const sitemapStream = createWriteStream(resolve(outDir, 'sitemap.xml'))
    sitemap.pipe(sitemapStream)
    links.forEach((link) => sitemap.write(link))
    sitemap.end()
  }
})

import { defineConfig } from 'vitepress'

import { createWriteStream } from 'node:fs'
import { resolve } from 'node:path'
import { Feed } from "feed"

const links = []
const posts = []

export default defineConfig({
  ... 
  transformHtml: (_, id, { pageData }) => {
    // for rss
    if (/posts/.test(id)) {
      var url = 'https://nshmura.com/' + pageData.relativePath.replace(/((^|\/)index)?\.md$/, '$2');
      posts.push({
        title: pageData.title,
        id: url,
        link: url,
        date: new Date(pageData.frontmatter.date),
        description: pageData.description,
        content: pageData.description,
      })
    }
  },
  buildEnd: ({ outDir }) => {
    // rss
    const feed = new Feed({
      title: "nshmura.com",
      description: "バックエンドエンジニアのメモ",
      id: "https://nshmura.com/",
      link: "https://nshmura.com/",
      language: "ja",
      favicon: "https://nshmura.com/favicon.ico",
    });
    posts.forEach((post) => { feed.addItem(post) });
    feed.addCategory("Technologie");
    const rssStream = createWriteStream(resolve(outDir, 'index.xml'))
    rssStream.write(feed.atom1());
  }
})

import { defineConfig } from 'vitepress']

export default defineConfig({
  ...
  head: [
    [
      'script',
      {
        async: true,
        src: 'https://www.googletagmanager.com/gtag/js?id=G-{Google Analytics のトラッキングID}',
      },
    ],
    [
      'script',
      {},
      "window.dataLayer = window.dataLayer || [];\nfunction gtag(){dataLayer.push(arguments);}\ngtag('js', new Date());\ngtag('config', 'G-{Google Analytics のトラッキングID}');",
    ],
  ],
  ...
})