diff --git a/.vitepress/genFeed.ts b/.vitepress/genFeed.ts
index 3dcfc83..bc80554 100644
--- a/.vitepress/genFeed.ts
+++ b/.vitepress/genFeed.ts
@@ -20,7 +20,7 @@ const feed = new Feed({
 
 load(true).then((posts) => {
   posts.forEach((post) => {
-    const file = path.resolve(dirname, `dist${post.href}`)
+    const file = path.resolve(dirname, `dist${post.href}.html`)
     const rendered = readFileSync(file, 'utf-8')
     const content = rendered.match(
       /<div [^<>]+?class="prose[^<>]+?>([\s\S]*)<\/div><\/div><footer/
diff --git a/.vitepress/theme/Layout.vue b/.vitepress/theme/Layout.vue
index 67dc202..5b4e991 100644
--- a/.vitepress/theme/Layout.vue
+++ b/.vitepress/theme/Layout.vue
@@ -1,13 +1,11 @@
 <script setup lang="ts">
 import { computed } from 'vue'
-import { useRoute } from 'vitepress'
+import { useData } from 'vitepress'
 import Home from './Home.vue'
 import Article from './Article.vue'
 import NotFound from './NotFound.vue'
 
-const route = useRoute()
-const isIndex = computed(() => route.path.replace(/index.html$/, '') === '/')
-const isNotFound = computed(() => route.component === NotFound)
+const { page, frontmatter } = useData()
 </script>
 
 <template>
@@ -21,7 +19,11 @@ const isNotFound = computed(() => route.component === NotFound)
             alt="logo"
             src="/logo.svg"
           />
-          <span v-if="!isIndex" class="hidden md:inline dark:text-white">The Vue Point</span>
+          <span
+            v-if="!frontmatter.index"
+            class="hidden md:inline dark:text-white"
+            >The Vue Point</span
+          >
         </a>
         <div class="text-sm text-gray-500 dark:text-white leading-5">
           <a
@@ -32,7 +34,9 @@ const isNotFound = computed(() => route.component === NotFound)
             ><span class="hidden sm:inline">GitHub </span>Source</a
           >
           <span class="mr-2 ml-2">·</span>
-          <a class="hover:text-gray-700 dark:hover:text-gray-200" href="/feed.rss"
+          <a
+            class="hover:text-gray-700 dark:hover:text-gray-200"
+            href="/feed.rss"
             >RSS<span class="hidden sm:inline"> Feed</span></a
           >
           <span class="mr-2 ml-2">·</span>
@@ -47,8 +51,8 @@ const isNotFound = computed(() => route.component === NotFound)
       </nav>
     </div>
     <main class="max-w-3xl mx-auto px-4 sm:px-6 xl:max-w-5xl xl:px-0">
-      <Home v-if="isIndex" />
-      <NotFound v-else-if="isNotFound" />
+      <Home v-if="frontmatter.index" />
+      <NotFound v-else-if="page.isNotFound" />
       <Article v-else />
     </main>
   </div>
diff --git a/.vitepress/theme/index.ts b/.vitepress/theme/index.ts
index 3b084cc..3b695c8 100644
--- a/.vitepress/theme/index.ts
+++ b/.vitepress/theme/index.ts
@@ -1,9 +1,6 @@
 import './style.css'
-
 import Layout from './Layout.vue'
-import NotFound from './NotFound.vue'
 
 export default {
-  Layout,
-  NotFound
+  Layout
 }
diff --git a/index.md b/index.md
index 8fe8b0c..fdd64d0 100644
--- a/index.md
+++ b/index.md
@@ -1,4 +1,5 @@
 ---
 title: The Vue Point
 subtext: Updates, tips & opinions from the maintainers of Vue.js.
----
\ No newline at end of file
+index: true
+---