docs: wip vitepress

Author: Akryum

packages/docs/package.json

@@ -3,16 +3,14 @@
   "version": "4.0.0-alpha.14",
   "private": true,
   "scripts": {
-    "dev": "vuepress dev src",
-    "build": "vuepress build src"
-  },
-  "devDependencies": {
-    "@vuepress/plugin-pwa": "^1.8.2",
-    "vue-template-compiler": "^2.6.14",
-    "vuepress": "^1.8.2"
+    "dev": "vitepress dev src",
+    "build": "vitepress build src"
   },
   "dependencies": {
     "core-js": "^3.18.0",
-    "vue-github-button": "^1.1.2"
+    "vue-github-button": "^3.0.1"
+  },
+  "devDependencies": {
+    "vitepress": "^0.18.1"
   }
 }

packages/docs/src/.vuepress/config.js renamed to packages/docs/src/.vitepress/config.js

@@ -1,9 +1,10 @@
 module.exports = {
   base: '/',
-  serviceWorker: true,
+
   head: [
     ['link', { rel: 'icon', href: '/favicon.png' }],
   ],
+
   locales: {
     '/': {
       lang: 'en-US',
@@ -16,20 +17,11 @@ module.exports = {
       description: '🚀 在你的 Vue.js 应用中集成 GraphQL！',
     },
   },
-  plugins: {
-    '@vuepress/pwa': {
-      serviceWorker: true,
-      updatePopup: {
-        '/': {
-          message: 'New content is available.',
-          buttonText: 'Refresh',
-        },
-      },
-    },
-  },
+
   themeConfig: {
     repo: 'Akryum/vue-apollo',
     docsDir: 'docs',
+    docsBranch: 'v4',
     editLinks: true,
     locales: {
       '/': {

packages/docs/src/.vuepress/components/sponsor-button.vue renamed to packages/docs/src/.vitepress/theme/components/sponsor-button.vue

@@ -0,0 +1,9 @@
+import DefaultTheme from 'vitepress/theme'
+import SponsorButton from './components/sponsor-button.vue'
+
+export default {
+  ...DefaultTheme,
+  enhanceApp ({ app }) {
+    app.component('SponsorButton', SponsorButton)
+  },
+}

packages/docs/src/.vitepress/theme/index.js

@@ -1,15 +1,19 @@
 ---
 home: true
+
 heroImage: /logo.png
+
 actionText: Get Started →
 actionLink: /guide/
+
 features:
 - title: Automatic updates
   details: Don't think about updating the UI or refetching the queries!
 - title: In-template components
   details: Use Apollo in a truly declarative way with the Apollo components
 - title: SSR-ready
   details: Run your queries on the server before rendering the page HTML
+
 footer: LICENCE MIT - Created by Guillaume CHAU (@Akryum)
 ---