Plug the blog plugin into Vuepress default theme

This site is mainly organized like a documentation, so the default theme of Vuepress (opens new window) works like a charm. However, problems occur when I wanted to add a blog section.

I could not choose @vuepress/theme-blog (opens new window) because that would disrupt my current site structure. Then I found the extracted version @vuepress/plugin-blog (opens new window), which is meant to be used as a plugin instead of a theme. However, its integration with the default theme is a pain. The itemLayout option worked but the indexLayout option did not. I even tried vuepress eject in order to figure out how I could make them both work, but concluded that it would cost a lot of time which I could not afford.

It was not until I found Chris Noring (opens new window)'s blog Create YOUR next static blog in Vuepress and Vue (opens new window) had I recognized that I could simply build an index page myself. So in the end, I only used the url formatting function of plugin-blog, while wrote other logics on my own (with reference to Chris' blog).

And now the work has come to an end. It is still far from satisfactory, but I have figured out how to do it, and will implement more features in the future.