feat: generaete /page/:page static page

demo/yun/App.vue

@@ -1,5 +1,9 @@
 <!-- You can mount anything here -->
 
+<script lang="ts" setup>
+// do script
+</script>
+
 <template>
   <!-- try it -->
   <div />

demo/yun/pages/404.md

@@ -0,0 +1,3 @@
+---
+layout: 404
+---

docs/pages/dev/docs.md

@@ -14,7 +14,7 @@ Valaxy 正在为 1.0 的发布做准备，我们很期待您参与文档的撰
 
 Valaxy 将中英文写一个 Markdown 文件中，因此您可以很容易地进行前后文对比。
 
-您可以以如下方式进行中英文内容书写，而公共的例子则只需保留一份。
+您可以以如下方式进行中英文内容书写，而文中公共的例子则只需保留一份。
 
 ```md
 ::: zh-CN
@@ -24,6 +24,10 @@ Valaxy 将中英文写一个 Markdown 文件中，因此您可以很容易地进
 ::: en
 **The effect is as follows** (click the button to switch).
 :::
+
+<div>
+This is a example.
+</div>
 ```
 
 ## 如何提交
@@ -36,12 +40,12 @@ Commit message 请以 `docs:` 开头。
 譬如，我对文档的指南部分的翻译进行了修改。
 即：`docs: update guide translation`。
 
-修改了错别字：
-即：`docs: fix typo`。
+修改了 `xxx.md` 中的错别字：
+即：`docs: fix xxx.md typo`。
 
 ## 奖励
 
 我们将会给为 Valaxy 贡献文档翻译及其他工作的用户发放一些奖励。
 
-- 超过 10 commit：赠送 Valaxy Logo 亚克力板挂件
-- 超过 20 commit：赠送 Valaxy Logo 与小云亚克力板挂件
+- 超过 10 commits：赠送 Valaxy Logo 亚克力板挂件
+- 超过 20 commits：赠送 Valaxy Logo 与小云亚克力板挂件

packages/create-valaxy/template/pages/404.md

@@ -0,0 +1,3 @@
+---
+layout: 404
+---

packages/valaxy-theme-yun/components/YunPostList.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
-import { computed, ref } from 'vue'
-import { useSiteStore } from 'valaxy'
-import type { Post } from 'valaxy'
+import { computed } from 'vue'
+import { useSiteConfig, useSiteStore } from 'valaxy'
+import type { Post } from 'valaxy/types'
 
 const props = withDefaults(defineProps<{
   type?: string
@@ -12,8 +12,8 @@ const props = withDefaults(defineProps<{
 })
 
 const site = useSiteStore()
-
-const pageSize = ref(7)
+const siteConfig = useSiteConfig()
+const pageSize = computed(() => siteConfig.value.pageSize)
 
 const posts = computed(() => props.posts || site.postList)
 const displayedPosts = computed(() => posts.value.slice((props.curPage - 1) * pageSize.value, props.curPage * pageSize.value))

packages/valaxy-theme-yun/layouts/home.vue

@@ -1,5 +1,6 @@
 <script lang="ts" setup>
 import { useAppStore, useLayout } from 'valaxy'
+import { computed } from 'vue'
 import { useRoute } from 'vue-router'
 import { useThemeConfig } from '../composables'
 
@@ -8,7 +9,7 @@ const isHome = useLayout('home')
 const themeConfig = useThemeConfig()
 
 const route = useRoute()
-const isPage = route.path.startsWith('/page')
+const isPage = computed(() => route.path.startsWith('/page'))
 </script>
 
 <template>

packages/valaxy/node/build.ts

@@ -36,6 +36,17 @@ export async function ssgBuild(
   defaultConfig.ssgOptions = {
     script: 'async',
     formatting: 'minify',
+    includedRoutes(paths, routes) {
+      const postSize = paths.filter(path => path.startsWith('/posts/')).length
+      const pages = Math.ceil(postSize / options.config.siteConfig.pageSize)
+      const pagesArr = Array.from({ length: pages }, (_, i) => i + 1)
+      return routes.flatMap((route) => {
+        // /page/:page
+        return route.path === '/page/:page'
+          ? pagesArr.map(slug => `/page/${slug}`)
+          : route.path
+      })
+    },
     onFinished() {
       generateSitemap(
         {

packages/valaxy/node/config/index.ts

@@ -82,6 +82,8 @@ export const defaultSiteConfig: SiteConfig = {
     selector: '',
     options: {},
   },
+
+  pageSize: 7,
 }
 
 export const defaultValaxyConfig: ValaxyNodeConfig = {

packages/valaxy/types/config.ts

@@ -199,6 +199,12 @@ export interface SiteConfig {
     selector: string | HTMLElement | HTMLElement[]
     options: ZoomOptions
   }
+
+  /**
+   * displayed posts length in every page
+   * @default 7
+   */
+  pageSize: number
 }
 
 export type PartialDeep<T> = {