tests: add nuxt-bridge example and enable example tests

Author: antfu

.github/workflows/test.yml

@@ -17,26 +17,37 @@ jobs:
 
     strategy:
       matrix:
-        node-version: [14.x, 16.x]
+        node: [14.x]
         os: [ubuntu-latest, windows-latest, macos-latest]
       fail-fast: false
 
     steps:
       - uses: actions/checkout@v2
 
-      - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v1
+      - name: Install pnpm
+        uses: pnpm/action-setup@v2.0.1
         with:
-          node-version: ${{ matrix.node-version }}
+          version: 6.23.5
 
-      - name: Setup
-        run: npm i -g pnpm @antfu/ni
+      - name: Set node version to ${{ matrix.node }}
+        uses: actions/setup-node@v2
+        with:
+          node-version: ${{ matrix.node }}
+          cache: "pnpm"
+
+      - uses: actions/checkout@v2
 
       - name: Install
-        run: nci
+        run: pnpm i
 
-      # - name: Lint
-      #   run: nr lint --if-present
+      - name: Lint
+        run: pnpm run lint
+
+      - name: Build
+        run: pnpm run build
 
       - name: Test
-        run: nr test --if-present
+        run: pnpm run test
+
+      - name: Build Examples
+        run: pnpm run build:examples

.gitignore

@@ -81,3 +81,4 @@ dist
 .idea
 
 temp.ts
+.output

examples/nuxt-bridge/README.md

@@ -0,0 +1,3 @@
+# Nuxt Bridge
+
+This plugin has been included in Nuxt Bridge out-of-the-box. This example only serves the purpose of testing the plugin integration with Nuxt Bridge.

examples/nuxt-bridge/layouts/default.vue

@@ -0,0 +1,11 @@
+<template>
+  <div>
+    <Nuxt />
+    <hr>
+    Route: {{ route.path }}
+  </div>
+</template>
+
+<script script>
+const route = useRoute()
+</script>

examples/nuxt-bridge/nuxt.config.ts

@@ -0,0 +1,9 @@
+import { defineNuxtConfig } from '@nuxt/bridge'
+
+export default defineNuxtConfig({
+  components: true,
+  bridge: {
+    meta: true,
+    vite: true,
+  },
+})

examples/nuxt-bridge/package.json

@@ -0,0 +1,14 @@
+{
+  "name": "example-bridge",
+  "private": true,
+  "scripts": {
+    "build": "nuxi build",
+    "dev": "nuxi dev"
+  },
+  "devDependencies": {
+    "@nuxt/bridge": "latest",
+    "nuxt-edge": "latest",
+    "vue": "^2",
+    "vue2": "npm:vue@^2"
+  }
+}

examples/nuxt-bridge/pages/index.vue

@@ -0,0 +1,18 @@
+<template>
+  <div>
+    <div>Hello Vue {{ version }}!</div>
+    <div>
+      State: {{ state }} <button @click="updateState">
+        Update
+      </button>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+useMeta({ meta: [{ name: 'description', content: 'This is a page to demo Nuxt Bridge.' }] })
+const version = ref('2')
+const state = useState('test-state')
+state.value = '123'
+const updateState = () => { state.value = '456' }
+</script>

examples/nuxt-bridge/pages/test/_slug.vue

@@ -0,0 +1,7 @@
+<template>
+  <div>
+    <nuxt-link :to="`/test/${Math.random() * 100}`">
+      Random path
+    </nuxt-link>
+  </div>
+</template>

examples/nuxt-bridge/tsconfig.json

@@ -0,0 +1,3 @@
+{
+  "extends": "./.nuxt/tsconfig.json"
+}