build: use github pages for staging

Octobug · Nov 22, 2023 · 87c1d14 · 87c1d14
1 parent b555700
commit 87c1d14
Show file tree

Hide file tree

Showing 7 changed files with 43 additions and 9 deletions.
diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
@@ -1,11 +1,14 @@
-name: GitHub Pages
+name: Staging
 
 on:
   push:
-    branches: [main]
+    branches: [staging]
 
   workflow_dispatch:
 
+env:
+  BASE_URL: ${{ vars.BASE_URL }}
+
 permissions:
   contents: read
   pages: write
@@ -43,7 +46,7 @@ jobs:
 
   deploy:
     environment:
-      name: production
+      name: Staging
       url: ${{ steps.deployment.outputs.page_url }}
     needs: build
     runs-on: ubuntu-latest

diff --git a/.vitepress/config.theme.ts b/.vitepress/config.theme.ts
@@ -1,6 +1,7 @@
 import type { ThemeConfig } from "./theme/types/theme-config";
 import { tokenize } from "./theme/search";
 import emailSVGString from "./theme/svgs/email";
+import { withBaseURL } from "./config.utils";
 
 export default {
   outline: "deep",
@@ -74,7 +75,7 @@ export default {
     },
   ],
   // Extended configs
-  avatar: "/avatar.png",
+  avatar: withBaseURL("/avatar.png"),
   nickname: "Octobug",
   bio: "Thoughts on everything.",
   location: "Shenzhen, China",

diff --git a/.vitepress/config.ts b/.vitepress/config.ts
@@ -1,10 +1,12 @@
 import { defineConfigWithTheme } from "vitepress";
 import type { ThemeConfig } from "./theme/types/theme-config";
 import themeConfig from "./config.theme";
+import { BASE_URL, withBaseURL } from "./config.utils";
 
 export default defineConfigWithTheme<ThemeConfig>({
   title: "WhaleVocal",
   description: "Octobug's blog.",
+  base: BASE_URL,
   cleanUrls: true,
   lastUpdated: true,
   head: [
@@ -13,7 +15,7 @@ export default defineConfigWithTheme<ThemeConfig>({
       {
         rel: "icon",
         type: "image/png",
-        href: "/avatar.png",
+        href: withBaseURL("/avatar.png")
       },
     ],
     [

diff --git a/.vitepress/config.utils.ts b/.vitepress/config.utils.ts
@@ -0,0 +1,8 @@
+import { env } from "process";
+import * as path from "path";
+
+export const BASE_URL = env.BASE_URL || undefined;
+
+export function withBaseURL(urlPath: string) {
+  return path.join(BASE_URL || "/", urlPath);
+}
diff --git a/.vitepress/theme/components/PostElements.vue b/.vitepress/theme/components/PostElements.vue
@@ -1,7 +1,7 @@
 <template>
   <div :class="$style.elementList">
     <span :class="$style.elementItem">
-      {{ moment(post.date).format("LL") }}
+      {{ moment(post.datetime).format("LL") }}
     </span>
     <Dot
       v-if="post.location"
@@ -35,7 +35,7 @@ const { frontmatter, page } = useData();
 let post = ref(getPostData());
 
 function getPostData() {
-  return findPost(allPosts, page.value).frontmatter || frontmatter.value;
+  return findPost(allPosts, page.value)?.frontmatter || frontmatter.value;
 }
 
 onContentUpdated(() => {

diff --git a/.vitepress/theme/posts.data.ts b/.vitepress/theme/posts.data.ts
@@ -2,6 +2,7 @@
 import { createContentLoader, ContentData } from "vitepress";
 import readingTime from "reading-time";
 import extendedConfig from "../config.theme";
+import { withBaseURL } from "../config.utils";
 
 declare const data: ContentData[];
 export { data };
@@ -20,7 +21,7 @@ export default createContentLoader(extendedConfig.mdfilePatterns, {
       p.frontmatter.title = extractTile(p.src || "");
       p.frontmatter.datetime = new Date(p.frontmatter.date);
       p.frontmatter.readingTime = readingTime(p.src || "").text;
-      p.url = p.url.replace("/README", "");
+      p.url = withBaseURL(p.url.replace("/README", ""));
       return p;
     }).sort((a, b) => {
       return b.frontmatter.datetime - a.frontmatter.datetime;

diff --git a/README.md b/README.md
@@ -1,8 +1,9 @@
 # 🐳 WhaleVocal
 
+[![Netlify Status](https://api.netlify.com/api/v1/badges/23e0b8dc-df98-491d-9885-d4229baa1ccb/deploy-status)](https://app.netlify.com/sites/octobug-blog/deploys)
 [![Badge: GitHub](https://github.com/Octobug/blog/actions/workflows/deploy.yml/badge.svg)](https://github.com/Octobug/blog/actions)
 
-Thoughts on everything: [blog.octobug.site](https://blog.octobug.site/).
+- <https://blog.octobug.site> (hosted on [Netlify](https://netlify.com/))
 
 ## The Theme
 
@@ -11,6 +12,24 @@ This blog is powered by [VitePress](https://vitepress.dev/) with a customized th
 - [airene/vitepress-blog-pure](https://github.com/airene/vitepress-blog-pure)
 - [clark-cui/vitepress-blog-zaun](https://github.com/clark-cui/vitepress-blog-zaun)
 
+### Features
+
+- [x] Home
+  - [x] Profile Card
+  - [x] Paged Post List
+- [ ] Single Post
+  - [x] Publication Date
+  - [x] Location
+  - [x] Reading Time
+  - [x] Prev/Next (without the built-in global sidebar)
+  - [ ] Comments with Giscus
+- [ ] Posts (Archives)
+- [ ] Tags
+- [ ] Sorts (Categories)
+- [ ] Others
+  - [ ] Visions (for special pages)
+  - [ ] Google Analytics
+
 ## Contribution
 
 This project is not going to be made an out-of-the-box blog theme. It's a very personal project, but any helps and advice are welcome.