feat(vue): upgrade swrv for vue 3 (#314)

* feat(*): update swrv for vue 3

* chore(examples): update basic example

* chore(examples): update vite example

* docs: update serve command

* chore(examples): update pwa

* fix: fallback IS_SERVER to false

* chore(examples): update pwa

* chore: bump version

* chore: update peerDependencies

* chore: update peerDependencies

* chore: update peerDependencies

* docs: update readme

* docs(vitepress): switch to vitepress

* ci: update node version

* ci: update test config

* ci: update test config

* ci: update workflow

* chore: resolves #285

* chore: badges

* chore: badges

* docs: update tagline

* docs: build link

* docs: outline levels

.github/workflows/main.yml

@@ -12,24 +12,25 @@ on:
 
 jobs:
   test:
+    name: Build and Test
     runs-on: ubuntu-latest
     strategy:
       matrix:
-        node-version: [12.x]
+        node-version: [16.x]
     steps:
-    - uses: actions/checkout@v1
+    - uses: actions/checkout@v3
     - name: Use Node.js ${{ matrix.node-version }}
-      uses: actions/setup-node@v1
+      uses: actions/setup-node@v3
       with:
-        node-version: ${{ matrix.node-version }} 
+        node-version: ${{ matrix.node-version }}
     - name: install, lint
       run: |
-        yarn install
+        yarn install --frozen-lockfile
         yarn lint --no-fix
     - name: tsc
       run: |
         yarn types:check
-    
+
     - name: test
       run: |
         yarn test-compat

README.md

@@ -3,8 +3,7 @@
 </p>
 <h1 align="center">swrv</h1>
 
-![build](https://github.com/Kong/swrv/workflows/build/badge.svg)
-[![](https://img.shields.io/npm/v/swrv.svg)](https://www.npmjs.com/package/swrv)
+[![](https://img.shields.io/npm/v/swrv.svg?style=flat-square)](https://www.npmjs.com/package/swrv) [![npm](https://img.shields.io/npm/dm/swrv?style=flat-square)](https://www.npmjs.com/package/swrv) ![build](https://github.com/Kong/swrv/workflows/build/badge.svg)
 
 `swrv` (pronounced "swerve") is a library using the [Vue Composition API](https://vuejs.org/guide/extras/composition-api-faq.html) for remote data fetching. It is largely a port of [swr](https://github.com/zeit/swr).
 
@@ -32,9 +31,9 @@ With `swrv`, components will get a stream of data updates constantly and automat
 ## Table of Contents<!-- omit in toc -->
 
 - [Installation](#installation)
+  - [Vue 3](#vue-3)
   - [Vue 2.7](#vue-27)
   - [Vue 2.6 and below](#vue-26-and-below)
-  - [Vue 3 (beta)](#vue-3-beta)
 - [Getting Started](#getting-started)
 - [Api](#api)
   - [Parameters](#parameters)
@@ -60,30 +59,29 @@ With `swrv`, components will get a stream of data updates constantly and automat
 
 The version of `swrv` you install depends on the Vue dependency in your project.
 
-### Vue 2.7
-
-This version removes the dependency of the external `@vue/composition-api` plugin and adds `vue` to the `peerDependencies`, requiring a version that matches the following pattern: `>= 2.7.0 < 3`
+### Vue 3
 
-```sh
+```shell
 # Install the latest version
 yarn add swrv
 ```
 
-### Vue 2.6 and below
+### Vue 2.7
 
-If you're installing for Vue `2.6.x` and below, you may want to check out a [previous version of the README](https://github.com/Kong/swrv/blob/b621aac02b7780a4143c5743682070223e793b10/README.md) to view how to initialize `swrv` utilizing the external `@vue/composition-api` plugin.
+This version removes the dependency of the external `@vue/composition-api` plugin and adds `vue` to the `peerDependencies`, requiring a version that matches the following pattern: `>= 2.7.0 < 3`
 
 ```shell
-# Install the 0.9.x version
-yarn add swrv@legacy
+# Install the 0.10.x version for Vue 2.7
+yarn add swrv@v2-latest
 ```
 
-### Vue 3 (beta)
+### Vue 2.6 and below
 
-If you want to try out Vue 3 support, install the beta release and check out the [Vite example](https://github.com/Kong/swrv/tree/next/examples/vite). `swrv` code for Vue 3.0 exists on `next` branch.
+If you're installing for Vue `2.6.x` and below, you may want to check out a [previous version of the README](https://github.com/Kong/swrv/blob/b621aac02b7780a4143c5743682070223e793b10/README.md) to view how to initialize `swrv` utilizing the external `@vue/composition-api` plugin.
 
 ```shell
-yarn add swrv@beta
+# Install the 0.9.x version for Vue < 2.7
+yarn add swrv@legacy
 ```
 
 ## Getting Started

docs/.vitepress/config.ts

@@ -0,0 +1,52 @@
+import { defineConfig } from 'vitepress'
+
+export default defineConfig({
+  title: 'swrv',
+  description: 'swrv',
+  head: [['link', { rel: 'icon', type: 'image/png', href: 'https://2tjosk2rxzc21medji3nfn1g-wpengine.netdna-ssl.com/wp-content/uploads/2018/08/kong-logomark-color-64px.png' }]],
+  lastUpdated: true,
+  themeConfig: {
+    outline: [2, 3],
+    socialLinks: [
+      { icon: 'github', link: 'https://github.com/Kong/swrv'}
+    ],
+    logo: '/logo_45.png',
+    footer: {
+      message: 'Released under the Apache-2.0 License.',
+      copyright: 'Copyright © 2020-present Kong, Inc.'
+    },
+    editLink: {
+      pattern: 'https://github.com/Kong/swrv/edit/master/docs/:path',
+      text: 'Edit this page on GitHub'
+    },
+    nav: [
+      { text: 'Home', link: '/' },
+      { text: 'Getting Started', link: '/guide/getting-started' },
+      { text: 'API Reference', link: '/configuration' }
+    ],
+    sidebar: [
+      {
+        text: 'Guide',
+        items: [
+          {
+            text: 'Getting Started',
+            link: '/guide/getting-started'
+          }
+        ]
+      },
+      {
+        text: 'APIs',
+        items: [
+          {
+              text: 'Configuration',
+              link: '/configuration'
+            },
+            {
+              text: 'Features',
+              link: '/features'
+            }
+        ]
+      }
+    ]
+  }
+})

docs/.vitepress/style.css

@@ -0,0 +1,3 @@
+:root {
+  --c-white: red;
+}

docs/.vitepress/theme/index.css

@@ -0,0 +1,13 @@
+:root {
+  --c-brand: #0089eb;
+  --c-brand-light: #0798ff;
+}
+
+.nav-bar .logo {
+  height: 25px;
+  margin-right: 0.5rem;
+}
+
+.custom-block.tip {
+  border-color: var(--c-brand-light);
+}

docs/.vitepress/theme/index.ts

@@ -0,0 +1,6 @@
+import DefaultTheme from 'vitepress/theme'
+import './index.css'
+
+export default {
+  ...DefaultTheme,
+}

docs/configuration.md

@@ -1,4 +1,8 @@
-# Configuration
+---
+title: Configuration
+---
+
+# {{ $frontmatter.title }}
 
 ```ts
 const { data, error, isValidating, mutate } = useSWRV(key, fetcher, options)

docs/features.md

@@ -1,6 +1,5 @@
 ---
 title: Features
-lang: en-US
 ---
 
 # {{ $frontmatter.title }}

docs/guide/getting-started.md

@@ -1,13 +1,12 @@
 ---
 title: Getting Started
-lang: en-US
 ---
 
 # {{ $frontmatter.title }}
 
-![build](https://github.com/Kong/swrv/workflows/build/badge.svg) [![](https://img.shields.io/npm/v/swrv.svg)](https://www.npmjs.com/package/swrv)
-
-[[toc]]
+|   Version   |  Downloads | Build |
+| --------- | -------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| [![](https://img.shields.io/npm/v/swrv.svg)](https://www.npmjs.com/package/swrv) | [![npm](https://img.shields.io/npm/dm/swrv)](https://www.npmjs.com/package/swrv) | [![build](https://github.com/Kong/swrv/workflows/build/badge.svg)](https://github.com/Kong/swrv) |
 
 ## Overview
 
@@ -22,6 +21,8 @@ The name “SWR” is derived from stale-while-revalidate, a cache invalidation
 - ⏲ Interval polling
 - ~~🖥 SSR support~~ (removed as of version `0.10.0` - [read more](https://github.com/Kong/swrv/pull/304))
 - 🖖 Vue 3 Support
+- 🖖 Vue 2.7.x Support (under the `v2-latest` tag on npm)
+- 🖖 Vue <= 2.6.x Support (under the `legacy` tag on npm)
 - Revalidation on focus
 - Request deduplication
 - TypeScript ready
@@ -36,30 +37,29 @@ With `swrv`, components will get a stream of data updates constantly and automat
 
 The version of `swrv` you install depends on the Vue dependency in your project.
 
-### Vue 2.7
-
-This version removes the dependency of the external `@vue/composition-api` plugin and adds `vue` to the `peerDependencies`, requiring a version that matches the following pattern: `>= 2.7.0 < 3`
+### Vue 3
 
 ```shell
 # Install the latest version
 yarn add swrv
 ```
 
-### Vue 2.6 and below
+### Vue 2.7
 
-If you're installing for Vue `2.6.x` and below, you may want to check out a [previous version of the README](https://github.com/Kong/swrv/blob/b621aac02b7780a4143c5743682070223e793b10/README.md) to view how to initialize `swrv` utilizing the external `@vue/composition-api` plugin.
+This version removes the dependency of the external `@vue/composition-api` plugin and adds `vue` to the `peerDependencies`, requiring a version that matches the following pattern: `>= 2.7.0 < 3`
 
 ```shell
-# Install the 0.9.x version
-yarn add swrv@legacy
+# Install the 0.10.x version for Vue 2.7
+yarn add swrv@v2-latest
 ```
 
-### Vue 3 (beta)
+### Vue 2.6 and below
 
-If you want to try out Vue 3 support, install the beta release and check out the [Vite example](https://github.com/Kong/swrv/tree/next/examples/vite). `swrv` code for Vue 3.0 exists on `next` branch.
+If you're installing for Vue `2.6.x` and below, you may want to check out a [previous version of the README](https://github.com/Kong/swrv/blob/b621aac02b7780a4143c5743682070223e793b10/README.md) to view how to initialize `swrv` utilizing the external `@vue/composition-api` plugin.
 
 ```shell
-yarn add swrv@beta
+# Install the 0.9.x version for Vue < 2.7
+yarn add swrv@legacy
 ```
 
 ## Usage