diff --git a/README.md b/README.md
index 64359ef..b0d872f 100644
--- a/README.md
+++ b/README.md
@@ -93,6 +93,19 @@ const vHero = directive()
```
+### Nuxt
+
+`hero-motion` also provide nuxt module for quick start
+
+```ts
+// nuxt.config.ts
+export default defineNuxtConfig({
+ modules: ['hero-motion/nuxt'],
+})
+```
+
+`hero-motion/nuxt` will auto import `Hero` component, and do not need to wrap root component with `HeroProvider`.
+
## Playground
See [playground](./playground/vite/README.md).
diff --git a/eslint.config.mjs b/eslint.config.mjs
index deaf97e..3b614a0 100644
--- a/eslint.config.mjs
+++ b/eslint.config.mjs
@@ -1,6 +1,3 @@
import antfu from '@antfu/eslint-config'
-import oxlint from 'eslint-plugin-oxlint'
-export default antfu({
- ...oxlint.configs['flat/recommended'],
-})
+export default antfu()
diff --git a/package.json b/package.json
index 777cb74..472e79b 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,7 @@
{
"name": "hero-motion",
"version": "0.3.3",
+ "packageManager": "pnpm@9.3.0+sha1.d4f1da7af76dbdb4ab1a08f6b5add602ffad6fd4",
"description": "A shared layout animations for vue like framer motion.",
"author": "zekun.jin",
"license": "MIT",
@@ -23,6 +24,11 @@
"types": "./dist/index.d.ts",
"import": "./dist/index.mjs",
"require": "./dist/index.cjs"
+ },
+ "./nuxt": {
+ "types": "./dist/nuxt/index.d.ts",
+ "import": "./dist/nuxt/index.mjs",
+ "require": "./dist/nuxt/index.cjs"
}
},
"main": "./dist/index.cjs",
@@ -30,8 +36,11 @@
"types": "./dist/index.d.ts",
"scripts": {
"dev": "tsup --watch",
- "play:vite": "cd playground/vite && pnpm dev",
- "build": "tsup",
+ "play": "pnpm play:vite",
+ "play:vite": "cd playgrounds/vite && pnpm dev",
+ "play:nuxt": "cd playgrounds/nuxt && pnpm dev",
+ "build": "pnpm build:nuxt || tsup",
+ "build:nuxt": "nuxt-module-build build --outDir ./dist/nuxt",
"lint": "eslint .",
"lint:fix": "eslint . --fix",
"test": "vitest"
@@ -41,20 +50,19 @@
"vue": ">=3.0.0"
},
"dependencies": {
+ "@nuxt/kit": "^3.13.2",
"@vueuse/core": "^11.0.3",
"defu": "^6.1.4"
},
"devDependencies": {
"@antfu/eslint-config": "^3.6.0",
+ "@nuxt/module-builder": "^0.8.4",
"@nuxtjs/eslint-config-typescript": "^12.1.0",
"@vue/tsconfig": "^0.5.1",
"@vueuse/motion": "^2.2.5",
"eslint": "^9.10.0",
- "eslint-plugin-oxlint": "^0.9.5",
- "oxlint": "^0.9.5",
"tsup": "^8.2.4",
"typescript": "^5.6.2",
- "unplugin-oxlint": "^0.6.2",
"unplugin-vue-jsx": "^0.4.0",
"vitest": "^2.1.1",
"vue": "^3.5.5"
diff --git a/playgrounds/nuxt/.gitignore b/playgrounds/nuxt/.gitignore
new file mode 100644
index 0000000..4a7f73a
--- /dev/null
+++ b/playgrounds/nuxt/.gitignore
@@ -0,0 +1,24 @@
+# Nuxt dev/build outputs
+.output
+.data
+.nuxt
+.nitro
+.cache
+dist
+
+# Node dependencies
+node_modules
+
+# Logs
+logs
+*.log
+
+# Misc
+.DS_Store
+.fleet
+.idea
+
+# Local env files
+.env
+.env.*
+!.env.example
diff --git a/playgrounds/nuxt/app.vue b/playgrounds/nuxt/app.vue
new file mode 100644
index 0000000..4aacbca
--- /dev/null
+++ b/playgrounds/nuxt/app.vue
@@ -0,0 +1,10 @@
+
+
+
+
+
+
+
+
diff --git a/playgrounds/nuxt/nuxt.config.ts b/playgrounds/nuxt/nuxt.config.ts
new file mode 100644
index 0000000..fec8498
--- /dev/null
+++ b/playgrounds/nuxt/nuxt.config.ts
@@ -0,0 +1,12 @@
+// https://nuxt.com/docs/api/configuration/nuxt-config
+export default defineNuxtConfig({
+ compatibilityDate: '2024-04-03',
+ devtools: { enabled: false },
+ modules: ['../../src/module'],
+
+ hero: {
+ transition: {
+ type: 'spring',
+ },
+ },
+})
diff --git a/playgrounds/nuxt/package.json b/playgrounds/nuxt/package.json
new file mode 100644
index 0000000..baa449d
--- /dev/null
+++ b/playgrounds/nuxt/package.json
@@ -0,0 +1,18 @@
+{
+ "name": "@hero-motion/nuxt",
+ "type": "module",
+ "private": true,
+ "scripts": {
+ "build": "nuxt build",
+ "dev": "nuxt dev",
+ "generate": "nuxt generate",
+ "preview": "nuxt preview",
+ "postinstall": "nuxt prepare"
+ },
+ "dependencies": {
+ "hero-motion": "workspace:*",
+ "nuxt": "^3.13.2",
+ "vue": "latest",
+ "vue-router": "latest"
+ }
+}
diff --git a/playgrounds/nuxt/public/favicon.ico b/playgrounds/nuxt/public/favicon.ico
new file mode 100644
index 0000000..18993ad
Binary files /dev/null and b/playgrounds/nuxt/public/favicon.ico differ
diff --git a/playgrounds/nuxt/public/robots.txt b/playgrounds/nuxt/public/robots.txt
new file mode 100644
index 0000000..8b13789
--- /dev/null
+++ b/playgrounds/nuxt/public/robots.txt
@@ -0,0 +1 @@
+
diff --git a/playgrounds/nuxt/server/tsconfig.json b/playgrounds/nuxt/server/tsconfig.json
new file mode 100644
index 0000000..b9ed69c
--- /dev/null
+++ b/playgrounds/nuxt/server/tsconfig.json
@@ -0,0 +1,3 @@
+{
+ "extends": "../.nuxt/tsconfig.server.json"
+}
diff --git a/playgrounds/nuxt/tsconfig.json b/playgrounds/nuxt/tsconfig.json
new file mode 100644
index 0000000..a746f2a
--- /dev/null
+++ b/playgrounds/nuxt/tsconfig.json
@@ -0,0 +1,4 @@
+{
+ // https://nuxt.com/docs/guide/concepts/typescript
+ "extends": "./.nuxt/tsconfig.json"
+}
diff --git a/playground/vite/.gitignore b/playgrounds/vite/.gitignore
similarity index 100%
rename from playground/vite/.gitignore
rename to playgrounds/vite/.gitignore
diff --git a/playground/vite/.vscode/extensions.json b/playgrounds/vite/.vscode/extensions.json
similarity index 100%
rename from playground/vite/.vscode/extensions.json
rename to playgrounds/vite/.vscode/extensions.json
diff --git a/playground/vite/README.md b/playgrounds/vite/README.md
similarity index 89%
rename from playground/vite/README.md
rename to playgrounds/vite/README.md
index aba55e1..9861af5 100644
--- a/playground/vite/README.md
+++ b/playgrounds/vite/README.md
@@ -12,7 +12,7 @@ You can also run `pnpm play:vite` in the root dir on your local environment.
## Tabs Component
-There is a [Tabs Component]('./playground/vite/components/Tabs') in playgound vite example, and let's pay attention to the [TabCursor]('./playground/vite/components/Tabs/TabCursor.vue')
+There is a [Tabs Component]('./playgrounds/vite/components/Tabs') in playgound vite example, and let's pay attention to the [TabCursor]('./playgrounds/vite/components/Tabs/TabCursor.vue')
This is the slider cursor for each `Tab` under the `Tabs` component.
@@ -62,7 +62,7 @@ const emit = defineEmits(['click'])
`hero-motion` support tansition across different pages, even when components are under different routes, ensure smooth transitions when navigating between them.
-See the [Avatar]('./playground/vite/components/Avatar.vue') component in the playground:
+See the [Avatar]('./playgrounds/vite/components/Avatar.vue') component in the playground:
```vue
+
+
+
+
+
+
diff --git a/src/runtime/plugin.ts b/src/runtime/plugin.ts
new file mode 100644
index 0000000..08c004c
--- /dev/null
+++ b/src/runtime/plugin.ts
@@ -0,0 +1,15 @@
+import { defineNuxtPlugin, useRuntimeConfig } from '#app'
+
+export default defineNuxtPlugin({
+ name: 'hero-motion',
+
+ setup() {
+ const config = useRuntimeConfig()
+
+ return {
+ provide: {
+ hero: config.public.hero ?? {},
+ },
+ }
+ },
+})
diff --git a/src/shims.d.ts b/src/shims.d.ts
new file mode 100644
index 0000000..eb2f984
--- /dev/null
+++ b/src/shims.d.ts
@@ -0,0 +1,5 @@
+declare module '#app' {
+ const defineNuxtPlugin: any
+ const useRuntimeConfig: any
+ const useNuxtApp: any
+}
diff --git a/tsup.config.ts b/tsup.config.ts
index 7bb8f8b..ed53c3c 100644
--- a/tsup.config.ts
+++ b/tsup.config.ts
@@ -1,22 +1,14 @@
import { defineConfig } from 'tsup'
-import Oxlint from 'unplugin-oxlint/esbuild'
import VueJSX from 'unplugin-vue-jsx/esbuild'
export default defineConfig(options => ({
- entry: ['src/**/*'],
+ entry: ['./src/index.ts'],
splitting: true,
- clean: true,
treeshake: true,
dts: true,
format: ['esm', 'cjs'],
minify: !options.watch,
esbuildPlugins: [
VueJSX({}),
- Oxlint({
- watch: !!options.watch,
- includes: ['src/**/*.ts', 'playground/*/src/**/*.ts'],
- deny: ['correctness'],
- packageManager: 'npm',
- }),
],
}))