@peterbud/nuxt-query 0.1.2 → 1.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +24 -14
- package/dist/client/200.html +1 -1
- package/dist/client/404.html +1 -1
- package/dist/client/_nuxt/C9t7u9-2.js +1 -0
- package/dist/client/_nuxt/Cn2mYuMm.js +1 -0
- package/dist/client/_nuxt/DNcbHZNN.js +27 -0
- package/dist/client/_nuxt/D_9vaMGK.js +1 -0
- package/dist/client/_nuxt/builds/latest.json +1 -1
- package/dist/client/_nuxt/builds/meta/d9848216-8a73-4ced-a9c6-1d7f8066a17f.json +1 -0
- package/dist/client/_nuxt/entry.BlV3gm4U.css +1 -0
- package/dist/client/_nuxt/error-404.BP6cZiLU.css +1 -0
- package/dist/client/_nuxt/error-500.m4XCO_xw.css +1 -0
- package/dist/client/_nuxt/etZT6pie.js +1 -0
- package/dist/client/_nuxt/oDGkq-0n.js +1 -0
- package/dist/client/_nuxt/{vue-query.DgPCHD25.css → vue-query.B7BC8ARl.css} +1 -1
- package/dist/client/index.html +1 -1
- package/dist/client/vue-query/index.html +1 -1
- package/dist/module.d.mts +1 -1
- package/dist/module.json +3 -3
- package/dist/module.mjs +17 -3
- package/package.json +19 -19
- package/dist/client/_nuxt/B8k3RGhf.js +0 -1
- package/dist/client/_nuxt/C8awSb-l.js +0 -1
- package/dist/client/_nuxt/CvHyQN7c.js +0 -27
- package/dist/client/_nuxt/Cy9q2YH7.js +0 -1
- package/dist/client/_nuxt/D1Sh_WFZ.js +0 -1
- package/dist/client/_nuxt/DfVK0wu1.js +0 -1
- package/dist/client/_nuxt/builds/meta/71581317-276a-4773-9c76-c445a649acbc.json +0 -1
- package/dist/client/_nuxt/entry.CIJgIWgc.css +0 -1
- package/dist/client/_nuxt/error-404.B7zLynNV.css +0 -1
- package/dist/client/_nuxt/error-500.DCuj293k.css +0 -1
package/README.md
CHANGED
|
@@ -5,18 +5,18 @@
|
|
|
5
5
|
[![License][license-src]][license-href]
|
|
6
6
|
[![Nuxt][nuxt-src]][nuxt-href]
|
|
7
7
|
|
|
8
|
-
|
|
8
|
+
A powerful Nuxt module for integrating [TanStack Query](https://tanstack.com/query/latest/docs/framework/vue/overview) (formerly Vue Query) into your Nuxt application. Provides robust server state management with intelligent caching, background updates, and seamless data synchronization.
|
|
9
9
|
|
|
10
10
|
- [✨ Release Notes](/CHANGELOG.md)
|
|
11
|
+
- [🏀 Online playground](https://stackblitz.com/github/peterbud/nuxt-query/tree/main/examples/minimal)
|
|
11
12
|
|
|
12
13
|
## Features
|
|
13
14
|
|
|
14
|
-
|
|
15
|
-
-
|
|
16
|
-
-
|
|
17
|
-
- 🏆 Support for complex `QueryClient` setup with handlers via hooks
|
|
15
|
+
- ⚙️ Zero-configuration integration
|
|
16
|
+
- 💪 Full TypeScript support with Vue Query configuration
|
|
17
|
+
- 🏆 Advanced `QueryClient` setup with custom handlers via hooks
|
|
18
18
|
- 🤖 Configurable auto-imports for Vue Query composables
|
|
19
|
-
- 🧩 Nuxt DevTools integration for
|
|
19
|
+
- 🧩 Nuxt DevTools integration for debugging and inspection
|
|
20
20
|
|
|
21
21
|
## Installation
|
|
22
22
|
|
|
@@ -29,7 +29,7 @@ npx nuxi module add @peterbud/nuxt-query
|
|
|
29
29
|
or via npm:
|
|
30
30
|
|
|
31
31
|
```bash
|
|
32
|
-
|
|
32
|
+
npm install @peterbud/nuxt-query
|
|
33
33
|
```
|
|
34
34
|
|
|
35
35
|
## Configuration
|
|
@@ -41,16 +41,22 @@ To configure Nuxt Query, update your `nuxt.config.ts` specifying the options you
|
|
|
41
41
|
export default defineNuxtConfig({
|
|
42
42
|
modules: ['@peterbud/nuxt-query'],
|
|
43
43
|
nuxtQuery: {
|
|
44
|
-
|
|
44
|
+
/**
|
|
45
|
+
* Specify which Vue Query composables to auto-import
|
|
46
|
+
* Default: `false`, set to `true` to auto-import all Vue Query composables
|
|
47
|
+
*/
|
|
45
48
|
autoImports: ['useQuery', 'useMutation'],
|
|
46
49
|
|
|
47
|
-
// Enable
|
|
50
|
+
// Enable/disable Nuxt DevTools integration (default: true)
|
|
48
51
|
devtools: true,
|
|
49
52
|
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
53
|
+
/**
|
|
54
|
+
* These are the same options as the QueryClient
|
|
55
|
+
* from @tanstack/vue-query, which will be passed
|
|
56
|
+
* to the QueryClient constructor
|
|
57
|
+
* More details: https://tanstack.com/query/v5/docs/reference/QueryClient
|
|
58
|
+
*/
|
|
59
|
+
|
|
54
60
|
queryClientOptions: {
|
|
55
61
|
defaultOptions: {
|
|
56
62
|
queries: {
|
|
@@ -87,7 +93,7 @@ That's it! You can now use Nuxt Query in your Nuxt app ✨
|
|
|
87
93
|
|
|
88
94
|
## Module Hooks
|
|
89
95
|
|
|
90
|
-
Nuxt Query provides a hook that you can use in your application if you need a more complex setup for
|
|
96
|
+
Nuxt Query provides a hook that you can use in your application if you need a more complex setup for TanStack Query, such as a custom query client with centralized `onSuccess` or `onError` handlers, which would not be possible to configure with the options available in the `nuxt.config.ts`.
|
|
91
97
|
|
|
92
98
|
The hook is called `nuxt-query:configure` and you can use it in a plugin to return a custom `QueryClient` object in the following way:
|
|
93
99
|
|
|
@@ -122,6 +128,10 @@ Nuxt Query integrates with Nuxt DevTools to provide a dedicated tab for Vue Quer
|
|
|
122
128
|
|
|
123
129
|
|
|
124
130
|
|
|
131
|
+
Also, you can inspect your mutation cache using the same DevTools in a convenient way.
|
|
132
|
+
|
|
133
|
+
|
|
134
|
+
|
|
125
135
|
## Contribution
|
|
126
136
|
|
|
127
137
|
<details>
|
package/dist/client/200.html
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
<!DOCTYPE html><html><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="stylesheet" href="/__nuxt-query-client/_nuxt/entry.
|
|
1
|
+
<!DOCTYPE html><html><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="stylesheet" href="/__nuxt-query-client/_nuxt/entry.BlV3gm4U.css" crossorigin><link rel="modulepreload" as="script" crossorigin href="/__nuxt-query-client/_nuxt/DNcbHZNN.js"><link rel="prefetch" as="style" crossorigin href="/__nuxt-query-client/_nuxt/error-404.BP6cZiLU.css"><link rel="prefetch" as="script" crossorigin href="/__nuxt-query-client/_nuxt/Cn2mYuMm.js"><link rel="prefetch" as="script" crossorigin href="/__nuxt-query-client/_nuxt/C9t7u9-2.js"><link rel="prefetch" as="script" crossorigin href="/__nuxt-query-client/_nuxt/etZT6pie.js"><link rel="prefetch" as="style" crossorigin href="/__nuxt-query-client/_nuxt/error-500.m4XCO_xw.css"><link rel="prefetch" as="script" crossorigin href="/__nuxt-query-client/_nuxt/D_9vaMGK.js"><script type="module" src="/__nuxt-query-client/_nuxt/DNcbHZNN.js" crossorigin></script></head><body><div id="__nuxt"></div><div id="teleports"></div><script type="application/json" data-nuxt-data="nuxt-app" data-ssr="false" id="__NUXT_DATA__">[{"prerenderedAt":1,"serverRendered":2},1755400686833,false]</script><script>window.__NUXT__={};window.__NUXT__.config={public:{},app:{baseURL:"/__nuxt-query-client",buildId:"d9848216-8a73-4ced-a9c6-1d7f8066a17f",buildAssetsDir:"/_nuxt/",cdnURL:""}}</script></body></html>
|
package/dist/client/404.html
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
<!DOCTYPE html><html><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="stylesheet" href="/__nuxt-query-client/_nuxt/entry.
|
|
1
|
+
<!DOCTYPE html><html><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="stylesheet" href="/__nuxt-query-client/_nuxt/entry.BlV3gm4U.css" crossorigin><link rel="modulepreload" as="script" crossorigin href="/__nuxt-query-client/_nuxt/DNcbHZNN.js"><link rel="prefetch" as="style" crossorigin href="/__nuxt-query-client/_nuxt/error-404.BP6cZiLU.css"><link rel="prefetch" as="script" crossorigin href="/__nuxt-query-client/_nuxt/Cn2mYuMm.js"><link rel="prefetch" as="script" crossorigin href="/__nuxt-query-client/_nuxt/C9t7u9-2.js"><link rel="prefetch" as="script" crossorigin href="/__nuxt-query-client/_nuxt/etZT6pie.js"><link rel="prefetch" as="style" crossorigin href="/__nuxt-query-client/_nuxt/error-500.m4XCO_xw.css"><link rel="prefetch" as="script" crossorigin href="/__nuxt-query-client/_nuxt/D_9vaMGK.js"><script type="module" src="/__nuxt-query-client/_nuxt/DNcbHZNN.js" crossorigin></script></head><body><div id="__nuxt"></div><div id="teleports"></div><script type="application/json" data-nuxt-data="nuxt-app" data-ssr="false" id="__NUXT_DATA__">[{"prerenderedAt":1,"serverRendered":2},1755400686833,false]</script><script>window.__NUXT__={};window.__NUXT__.config={public:{},app:{baseURL:"/__nuxt-query-client",buildId:"d9848216-8a73-4ced-a9c6-1d7f8066a17f",buildAssetsDir:"/_nuxt/",cdnURL:""}}</script></body></html>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{g as O,X as q,B,x as j,e as R,k as T,Y as N,O as U,j as A,U as L,Z as E,$ as w,a0 as I,A as b,a1 as _,a2 as D,a3 as F,a4 as H,a5 as V,a6 as z,a7 as M,a8 as W,a9 as $}from"./DNcbHZNN.js";const G=(...t)=>t.find(o=>o!==void 0);function Q(t){const o=t.componentName||"NuxtLink";function v(e){return typeof e=="string"&&e.startsWith("#")}function S(e,u,f){const r=f??t.trailingSlash;if(!e||r!=="append"&&r!=="remove")return e;if(typeof e=="string")return k(e,r);const l="path"in e&&e.path!==void 0?e.path:u(e).path;return{...e,name:void 0,path:k(l,r)}}function C(e){const u=q(),f=F(),r=b(()=>!!e.target&&e.target!=="_self"),l=b(()=>{const i=e.to||e.href||"";return typeof i=="string"&&_(i,{acceptRelative:!0})}),y=L("RouterLink"),h=y&&typeof y!="string"?y.useLink:void 0,c=b(()=>{if(e.external)return!0;const i=e.to||e.href||"";return typeof i=="object"?!1:i===""||l.value}),n=b(()=>{const i=e.to||e.href||"";return c.value?i:S(i,u.resolve,e.trailingSlash)}),g=c.value?void 0:h?.({...e,to:n}),m=b(()=>{const i=e.trailingSlash??t.trailingSlash;if(!n.value||l.value||v(n.value))return n.value;if(c.value){const p=typeof n.value=="object"&&"path"in n.value?w(n.value):n.value,x=typeof p=="object"?u.resolve(p).href:p;return k(x,i)}return typeof n.value=="object"?u.resolve(n.value)?.href??null:k(D(f.app.baseURL,n.value),i)});return{to:n,hasTarget:r,isAbsoluteUrl:l,isExternal:c,href:m,isActive:g?.isActive??b(()=>n.value===u.currentRoute.value.path),isExactActive:g?.isExactActive??b(()=>n.value===u.currentRoute.value.path),route:g?.route??b(()=>u.resolve(n.value)),async navigate(i){await H(m.value,{replace:e.replace,external:c.value||r.value})}}}return O({name:o,props:{to:{type:[String,Object],default:void 0,required:!1},href:{type:[String,Object],default:void 0,required:!1},target:{type:String,default:void 0,required:!1},rel:{type:String,default:void 0,required:!1},noRel:{type:Boolean,default:void 0,required:!1},prefetch:{type:Boolean,default:void 0,required:!1},prefetchOn:{type:[String,Object],default:void 0,required:!1},noPrefetch:{type:Boolean,default:void 0,required:!1},activeClass:{type:String,default:void 0,required:!1},exactActiveClass:{type:String,default:void 0,required:!1},prefetchedClass:{type:String,default:void 0,required:!1},replace:{type:Boolean,default:void 0,required:!1},ariaCurrentValue:{type:String,default:void 0,required:!1},external:{type:Boolean,default:void 0,required:!1},custom:{type:Boolean,default:void 0,required:!1},trailingSlash:{type:String,default:void 0,required:!1}},useLink:C,setup(e,{slots:u}){const f=q(),{to:r,href:l,navigate:y,isExternal:h,hasTarget:c,isAbsoluteUrl:n}=C(e),g=B(!1),m=j(null),i=s=>{m.value=e.custom?s?.$el?.nextElementSibling:s?.$el};function p(s){return!g.value&&(typeof e.prefetchOn=="string"?e.prefetchOn===s:e.prefetchOn?.[s]??t.prefetchOn?.[s])&&(e.prefetch??t.prefetch)!==!1&&e.noPrefetch!==!0&&e.target!=="_blank"&&!Z()}async function x(s=R()){if(g.value)return;g.value=!0;const d=typeof r.value=="string"?r.value:h.value?w(r.value):f.resolve(r.value).fullPath,a=h.value?new URL(d,window.location.href).href:d;await Promise.all([s.hooks.callHook("link:prefetch",a).catch(()=>{}),!h.value&&!c.value&&I(r.value,f).catch(()=>{})])}if(p("visibility")){const s=R();let d,a=null;T(()=>{const P=X();N(()=>{d=M(()=>{m?.value?.tagName&&(a=P.observe(m.value,async()=>{a?.(),a=null,await x(s)}))})})}),U(()=>{d&&W(d),a?.(),a=null})}return()=>{if(!h.value&&!c.value&&!v(r.value)){const a={ref:i,to:r.value,activeClass:e.activeClass||t.activeClass,exactActiveClass:e.exactActiveClass||t.exactActiveClass,replace:e.replace,ariaCurrentValue:e.ariaCurrentValue,custom:e.custom};return e.custom||(p("interaction")&&(a.onPointerenter=x.bind(null,void 0),a.onFocus=x.bind(null,void 0)),g.value&&(a.class=e.prefetchedClass||t.prefetchedClass),a.rel=e.rel||void 0),A(L("RouterLink"),a,u.default)}const s=e.target||null,d=G(e.noRel?"":e.rel,t.externalRelAttribute,n.value||c.value?"noopener noreferrer":"")||null;return e.custom?u.default?u.default({href:l.value,navigate:y,prefetch:x,get route(){if(!l.value)return;const a=new URL(l.value,window.location.href);return{path:a.pathname,fullPath:a.pathname,get query(){return E(a.search)},hash:a.hash,params:{},name:void 0,matched:[],redirectedFrom:void 0,meta:{},href:l.value}},rel:d,target:s,isExternal:h.value||c.value,isActive:!1,isExactActive:!1}):null:A("a",{ref:m,href:l.value||null,rel:d,target:s,onClick:a=>{if(!(h.value||c.value))return a.preventDefault(),e.replace?f.replace(l.value):f.push(l.value)}},u.default?.())}}})}const K=Q($);function k(t,o){const v=o==="append"?V:z;return _(t)&&!t.startsWith("http")?t:v(t,!0)}function X(){const t=R();if(t._observer)return t._observer;let o=null;const v=new Map,S=(e,u)=>(o||=new IntersectionObserver(f=>{for(const r of f){const l=v.get(r.target);(r.isIntersecting||r.intersectionRatio>0)&&l&&l()}}),v.set(e,u),o.observe(e),()=>{v.delete(e),o?.unobserve(e),v.size===0&&(o?.disconnect(),o=null)});return t._observer={observe:S}}const Y=/2g/;function Z(){const t=navigator.connection;return!!(t&&(t.saveData||Y.test(t.effectiveType)))}export{K as _};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{_ as s}from"./C9t7u9-2.js";import{_ as a,c as i,o as u,a as t,t as n,b as c,w as l,d}from"./DNcbHZNN.js";import{u as f}from"./etZT6pie.js";const p={class:"antialiased bg-white dark:bg-[#020420] dark:text-white font-sans grid min-h-screen overflow-hidden place-content-center text-[#020420] tracking-wide"},m={class:"max-w-520px text-center"},h=["textContent"],g=["textContent"],b=["textContent"],x={class:"flex items-center justify-center w-full"},y={__name:"error-404",props:{appName:{type:String,default:"Nuxt"},statusCode:{type:Number,default:404},statusMessage:{type:String,default:"Page not found"},description:{type:String,default:"Sorry, the page you are looking for could not be found."},backHome:{type:String,default:"Go back home"}},setup(e){const r=e;return f({title:`${r.statusCode} - ${r.statusMessage} | ${r.appName}`,script:[{innerHTML:`!function(){const e=document.createElement("link").relList;if(!(e&&e.supports&&e.supports("modulepreload"))){for(const e of document.querySelectorAll('link[rel="modulepreload"]'))r(e);new MutationObserver(e=>{for(const o of e)if("childList"===o.type)for(const e of o.addedNodes)"LINK"===e.tagName&&"modulepreload"===e.rel&&r(e)}).observe(document,{childList:!0,subtree:!0})}function r(e){if(e.ep)return;e.ep=!0;const r=function(e){const r={};return e.integrity&&(r.integrity=e.integrity),e.referrerPolicy&&(r.referrerPolicy=e.referrerPolicy),"use-credentials"===e.crossOrigin?r.credentials="include":"anonymous"===e.crossOrigin?r.credentials="omit":r.credentials="same-origin",r}(e);fetch(e.href,r)}}();`}],style:[{innerHTML:'*,:after,:before{border-color:var(--un-default-border-color,#e5e7eb);border-style:solid;border-width:0;box-sizing:border-box}:after,:before{--un-content:""}html{line-height:1.5;-webkit-text-size-adjust:100%;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;-moz-tab-size:4;tab-size:4;-webkit-tap-highlight-color:transparent}body{line-height:inherit;margin:0}h1,h2{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}h1,h2,p{margin:0}*,:after,:before{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 transparent;--un-ring-shadow:0 0 transparent;--un-shadow-inset: ;--un-shadow:0 0 transparent;--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgba(147,197,253,.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }'}]}),(k,_)=>{const o=s;return u(),i("div",p,[t("div",m,[t("h1",{class:"font-semibold leading-none mb-4 sm:text-[110px] tabular-nums text-[80px]",textContent:n(e.statusCode)},null,8,h),t("h2",{class:"font-semibold mb-2 sm:text-3xl text-2xl",textContent:n(e.statusMessage)},null,8,g),t("p",{class:"mb-4 px-2 text-[#64748B] text-md",textContent:n(e.description)},null,8,b),t("div",x,[c(o,{to:"/",class:"font-medium hover:text-[#00DC82] text-sm underline underline-offset-3"},{default:l(()=>[d(n(e.backHome),1)]),_:1})])])])}}},N=a(y,[["__scopeId","data-v-f05025cc"]]);export{N as default};
|