feat: nuxt module (#33)

* feat: add nuxt modules

* chore: move ginjou pkgs to dependencies

* chore: add plugin

internals/tsconfig/base.json

@@ -24,6 +24,7 @@
 		"paths": {
 			"@ginjou/core": ["../../packages/core/src/index.ts"],
 			"@ginjou/vue": ["../../packages/vue/src/index.ts"],
+			"@ginjou/vue/plugin": ["../../packages/vue/src/plugin.ts"],
 			"@ginjou/with-vue-router": ["../../packages/with-vue-router/src/index.ts"],
 			"@ginjou/with-vue-i18n": ["../../packages/with-vue-i18n/src/index.ts"],
 			"@ginjou/with-rest-api": ["../../packages/with-rest-api/src/index.ts"],

package.json

@@ -12,6 +12,7 @@
 		"test": "turbo run test",
 		"dev:test": "turbo run dev:test",
 		"dev:sb-vue": "turbo run dev --filter=@ginjou/storybook-vue",
+		"dev:nuxt": "turbo run dev --filter=@ginjou/nuxt",
 		"release:pkgs": "turbo run release --concurrency=1 --filter=./packages/*",
 		"lint": "eslint . --cache --cache-location ./node_modules/.cache/eslint"
 	},

packages/nuxt/.gitignore

@@ -0,0 +1,2 @@
+.nuxt/
+payground/.nuxt/

packages/nuxt/.release-it.cjs

@@ -0,0 +1 @@
+module.exports = require('@ginjou/release-it-config')

packages/nuxt/nuxt.config.ts

@@ -0,0 +1,7 @@
+import { fileURLToPath, URL } from 'node:url'
+
+export default {
+	alias: {
+		'@ginjou/vue/plugin': fileURLToPath(new URL('../vue/src/plugin', import.meta.url)),
+	},
+}

packages/nuxt/package.json

@@ -0,0 +1,50 @@
+{
+	"name": "@ginjou/nuxt",
+	"type": "module",
+	"version": "0.1.0-beta.0",
+	"author": "zhong666 <[email protected]>",
+	"license": "MIT",
+	"repository": {
+		"type": "git",
+		"url": "https://github.com/aa900031/ginjou"
+	},
+	"bugs": {
+		"url": "https://github.com/aa900031/ginjou/issues"
+	},
+	"sideEffects": false,
+	"exports": {
+		".": {
+			"types": "./dist/module.d.ts",
+			"import": "./dist/module.mjs",
+			"require": "./dist/module.cjs"
+		}
+	},
+	"main": "./dist/module.mjs",
+	"types": "./dist/module.d.ts",
+	"files": [
+		"dist"
+	],
+	"publishConfig": {
+		"access": "public"
+	},
+	"scripts": {
+		"build": "nuxt-module-build build",
+		"build:prepare": "nuxt-module-build build --stub && nuxt-module-build prepare",
+		"dev:playground": "nuxi dev playground",
+		"dev": "run-s build:prepare dev:playground",
+		"release": "release-it --ci"
+	},
+	"dependencies": {
+		"@ginjou/vue": "workspace:^",
+		"@ginjou/with-vue-router": "workspace:^",
+		"@nuxt/kit": "^3.9.0"
+	},
+	"devDependencies": {
+		"@ginjou/vue": "workspace:^",
+		"@nuxt/module-builder": "^0.8.4",
+		"@nuxt/schema": "^3.9.0",
+		"@nuxt/test-utils": "^3.14.4",
+		"npm-run-all2": "^6.2.6",
+		"nuxt": "^3.14.1592"
+	}
+}

packages/nuxt/playground/app.vue

@@ -0,0 +1,9 @@
+<script setup lang="ts">
+</script>
+
+<template>
+	<NuxtRouteAnnouncer />
+	<NuxtLayout>
+		<NuxtPage />
+	</NuxtLayout>
+</template>

packages/nuxt/playground/ginjou/fetcher.ts

@@ -0,0 +1,48 @@
+import type { Fetchers } from '@ginjou/core'
+
+export default () => ({
+	default: {
+		getOne: async ({ resource, id }) => {
+			switch (resource) {
+				case 'posts':
+					await new Promise(resolve => setTimeout(resolve, 500))
+					return {
+						data: {
+							id,
+							name: `posts-${id}`,
+						} as any,
+					}
+				case 'users':
+					return {
+						data: {
+							id,
+							name: `users-${id}`,
+						},
+					}
+				default:
+					throw new Error('No')
+			}
+		},
+
+		getList: async ({ resource }) => {
+			switch (resource) {
+				case 'posts':
+					return {
+						data: [
+							{
+								id: '1',
+								name: `posts-1`,
+							},
+							{
+								id: '2',
+								name: `posts-2`,
+							},
+						],
+						total: 2,
+					}
+				default:
+					break
+			}
+		},
+	},
+} satisfies Fetchers)

packages/nuxt/playground/ginjou/query.ts

@@ -0,0 +1,11 @@
+import type { VueQueryPluginOptions } from '@tanstack/vue-query'
+
+export default {
+	queryClientConfig: {
+		defaultOptions: {
+			queries: {
+				staleTime: 5 * 60 * 1000,
+			},
+		},
+	},
+} satisfies VueQueryPluginOptions

packages/nuxt/playground/ginjou/resource.ts

@@ -0,0 +1,11 @@
+import type { Resource } from '@ginjou/core'
+
+export default () => ({
+	resources: [
+		{
+			name: 'posts',
+			show: '/posts/:id',
+			list: '/posts',
+		},
+	],
+} satisfies Resource)

packages/nuxt/playground/nuxt.config.ts

@@ -0,0 +1,7 @@
+export default defineNuxtConfig({
+	devtools: { enabled: true },
+	modules: [
+		'@ginjou/nuxt',
+	],
+	compatibilityDate: '2024-12-24',
+})

packages/nuxt/playground/package.json

@@ -0,0 +1,15 @@
+{
+	"name": "@ginjou/nuxt-playground",
+	"type": "module",
+	"private": true,
+	"scripts": {
+		"dev": "nuxi dev",
+		"build": "nuxi build",
+		"generate": "nuxi generate",
+		"dev:prepare": "nuxt prepare"
+	},
+	"dependencies": {
+		"@ginjou/nuxt": "workspace:^",
+		"nuxt": "^3.14.159"
+	}
+}

packages/nuxt/playground/pages/index.vue

@@ -0,0 +1,14 @@
+<script setup lang="ts">
+</script>
+
+<template>
+	<div>
+		<NuxtLink to="/posts">
+			Posts
+		</NuxtLink>
+		<NuxtLink to="/other">
+			Other
+		</NuxtLink>
+	</div>
+	<NuxtPage />
+</template>

packages/nuxt/playground/pages/index/other.vue

@@ -0,0 +1,34 @@
+<script setup lang="ts">
+const resource = ref('posts')
+const id = ref('1')
+const { record } = useGetOne({
+	resource,
+	id,
+})
+</script>
+
+<template>
+	<div>
+		<label>Resource: </label>
+		<input
+			v-model="resource"
+			type="radio"
+			value="posts"
+		>
+		<label>Posts</label>
+
+		<input
+			v-model="resource"
+			type="radio"
+			value="users"
+		>
+		<label>Users</label>
+	</div>
+	<div>
+		<label>ID: </label>
+		<input v-model="id" type="text">
+	</div>
+	<pre>
+		{{ record }}
+	</pre>
+</template>

packages/nuxt/playground/pages/index/posts/[id].vue

@@ -0,0 +1,7 @@
+<script setup lang="ts">
+const { record } = useShow()
+</script>
+
+<template>
+	<pre>{{ record }}</pre>
+</template>

packages/nuxt/playground/pages/index/posts/index.vue

@@ -0,0 +1,16 @@
+<script setup lang="ts">
+const { records } = useList()
+</script>
+
+<template>
+	<ul>
+		<li
+			v-for="record in records"
+			:key="record.id"
+		>
+			<NuxtLink :to="`/posts/${record.id}`">
+				{{ record.name }}
+			</NuxtLink>
+		</li>
+	</ul>
+</template>

packages/nuxt/playground/tsconfig.json

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

packages/nuxt/src/imports/ginjou.ts

@@ -0,0 +1,55 @@
+import type { addImports } from '@nuxt/kit'
+
+const composables = [
+	'useAccessContext',
+	'useAuthContext',
+	'useAuthenticated',
+	'useBack',
+	'useCheckError',
+	'useCreate',
+	'useCreateMany',
+	'useCustom',
+	'useCustomMutation',
+	'useDelete',
+	'useDeleteMany',
+	'useFetchersContext',
+	'useForm',
+	'useGetIdentity',
+	'useGetInfiniteList',
+	'useGetList',
+	'useGetMany',
+	'useGetOne',
+	'useGo',
+	'useI18nContext',
+	'useList',
+	'useLocale',
+	'useLocation',
+	'useLogin',
+	'useLogout',
+	'useNavigateTo',
+	'useNotificationContext',
+	'useNotify',
+	'usePermissions',
+	'usePublish',
+	'useQueryClientContext',
+	'useRealtimeContext',
+	'useRealtimeOptions',
+	'useResolvePath',
+	'useResource',
+	'useResourceContext',
+	'useResourcePath',
+	'useRouterContext',
+	'useSelect',
+	'useShow',
+	'useSubscribe',
+	'useTranslate',
+	'useUpdate',
+	'useUpdateMany',
+]
+
+export default composables.map(
+	name => ({
+		name,
+		from: '@ginjou/vue',
+	}),
+) satisfies (Parameters<typeof addImports> extends [infer T] ? T : never)[]

packages/nuxt/src/imports/query.ts

@@ -0,0 +1,18 @@
+import type { addImports } from '@nuxt/kit'
+
+const composables = [
+	'useQuery',
+	'useQueries',
+	'useInfiniteQuery',
+	'useMutation',
+	'useIsFetching',
+	'useIsMutating',
+	'useQueryClient',
+]
+
+export default composables.map(
+	name => ({
+		name,
+		from: '@tanstack/vue-query',
+	}),
+) satisfies (Parameters<typeof addImports> extends [infer T] ? T : never)[]