[{"data":1,"prerenderedAt":360},["ShallowReactive",2],{"navigation_docs":3,"diagnostic-content-NUXT0065":44},[4,8,12,16,20,24,28,32,36,40],{"title":5,"path":6,"stem":7},"CLI","\u002Fcli","1.cli",{"title":9,"path":10,"stem":11},"Nuxt","\u002Fnuxt","2.nuxt",{"title":13,"path":14,"stem":15},"Vue","\u002Fvue","3.vue",{"title":17,"path":18,"stem":19},"Vite","\u002Fvite","4.vite",{"title":21,"path":22,"stem":23},"Nitro","\u002Fnitro","5.nitro",{"title":25,"path":26,"stem":27},"TypeScript","\u002Ftypescript","6.typescript",{"title":29,"path":30,"stem":31},"shadcn","\u002Fshadcn","7.shadcn",{"title":33,"path":34,"stem":35},"Package","\u002Fpackage","8.package",{"title":37,"path":38,"stem":39},"Extending Doctor","\u002Fextending","9.extending",{"title":41,"path":42,"stem":43},"Pinia","\u002Fpinia","9.pinia",{"id":45,"title":46,"body":47,"category":53,"code":350,"description":351,"docsUrl":54,"extension":352,"fix":77,"framework":353,"meta":354,"navigation":355,"pack":56,"path":356,"ruleId":57,"rulePath":58,"seo":357,"severity":59,"source":60,"sourceUrl":61,"stem":358,"why":70,"__hash__":359},"diagnostics\u002Fdiagnostics\u002FNUXT0065.md","NUXT0065: Use VueUse observer composables",{"type":48,"value":49,"toc":340},"minimark",[50,62,67,71,75,78,82,87,90,226,229,276,280,283,308,312,324,328,336],[51,52],"rule-metadata",{"category":53,"docsUrl":54,"fix":55,"pack":56,"ruleId":57,"rulePath":58,"severity":59,"source":60,"sourceUrl":61},"browser-api","https:\u002F\u002Fvueuse.org\u002Fcore\u002FuseIntersectionObserver\u002F#usage","suggestion","vite-doctor\u002Fvueuse","vueuse\u002Fprefer-use-observers","\u002Fnuxt\u002Frules\u002Fbrowser-api\u002Fprefer-use-observers","info","src\u002Frule-packs\u002Fnuxt\u002Frules\u002Fvueuse.ts","https:\u002F\u002Fgithub.com\u002Fonmax\u002Fvite-doctor\u002Fblob\u002Fmain\u002Fsrc\u002Frule-packs\u002Fnuxt\u002Frules\u002Fvueuse.ts",[63,64,66],"h2",{"id":65},"why-it-happens","Why it happens",[68,69,70],"p",{},"Effects that outlive their component create leaks and stale updates. Register cleanup where Vue or VueUse can dispose it automatically.",[63,72,74],{"id":73},"fix","Fix",[68,76,77],{},"Use the VueUse-supported use observers pattern instead.",[63,79,81],{"id":80},"example","Example",[83,84,86],"h3",{"id":85},"use-vueuse-observers","Use VueUse observers",[68,88,89],{},"Before",[91,92,97],"pre",{"className":93,"code":94,"language":95,"meta":96,"style":96},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript setup lang=\"ts\">\nonMounted(() => {\n  const observer = new ResizeObserver(onResize)\n  observer.observe(panel.value!)\n})\n\u003C\u002Fscript>\n","vue","",[98,99,100,135,155,181,208,216],"code",{"__ignoreMap":96},[101,102,105,109,113,117,120,123,126,130,132],"span",{"class":103,"line":104},"line",1,[101,106,108],{"class":107},"sMK4o","\u003C",[101,110,112],{"class":111},"swJcz","script",[101,114,116],{"class":115},"spNyl"," setup",[101,118,119],{"class":115}," lang",[101,121,122],{"class":107},"=",[101,124,125],{"class":107},"\"",[101,127,129],{"class":128},"sfazB","ts",[101,131,125],{"class":107},[101,133,134],{"class":107},">\n",[101,136,138,142,146,149,152],{"class":103,"line":137},2,[101,139,141],{"class":140},"s2Zo4","onMounted",[101,143,145],{"class":144},"sTEyZ","(",[101,147,148],{"class":107},"()",[101,150,151],{"class":115}," =>",[101,153,154],{"class":107}," {\n",[101,156,158,161,164,167,170,173,175,178],{"class":103,"line":157},3,[101,159,160],{"class":115},"  const",[101,162,163],{"class":144}," observer",[101,165,166],{"class":107}," =",[101,168,169],{"class":107}," new",[101,171,172],{"class":140}," ResizeObserver",[101,174,145],{"class":111},[101,176,177],{"class":144},"onResize",[101,179,180],{"class":111},")\n",[101,182,184,187,190,193,195,198,200,203,206],{"class":103,"line":183},4,[101,185,186],{"class":144},"  observer",[101,188,189],{"class":107},".",[101,191,192],{"class":140},"observe",[101,194,145],{"class":111},[101,196,197],{"class":144},"panel",[101,199,189],{"class":107},[101,201,202],{"class":144},"value",[101,204,205],{"class":107},"!",[101,207,180],{"class":111},[101,209,211,214],{"class":103,"line":210},5,[101,212,213],{"class":107},"}",[101,215,180],{"class":144},[101,217,219,222,224],{"class":103,"line":218},6,[101,220,221],{"class":107},"\u003C\u002F",[101,223,112],{"class":111},[101,225,134],{"class":107},[68,227,228],{},"After",[91,230,232],{"className":93,"code":231,"language":95,"meta":96,"style":96},"\u003Cscript setup lang=\"ts\">\nuseResizeObserver(panel, onResize)\n\u003C\u002Fscript>\n",[98,233,234,254,268],{"__ignoreMap":96},[101,235,236,238,240,242,244,246,248,250,252],{"class":103,"line":104},[101,237,108],{"class":107},[101,239,112],{"class":111},[101,241,116],{"class":115},[101,243,119],{"class":115},[101,245,122],{"class":107},[101,247,125],{"class":107},[101,249,129],{"class":128},[101,251,125],{"class":107},[101,253,134],{"class":107},[101,255,256,259,262,265],{"class":103,"line":137},[101,257,258],{"class":140},"useResizeObserver",[101,260,261],{"class":144},"(panel",[101,263,264],{"class":107},",",[101,266,267],{"class":144}," onResize)\n",[101,269,270,272,274],{"class":103,"line":157},[101,271,221],{"class":107},[101,273,112],{"class":111},[101,275,134],{"class":107},[63,277,279],{"id":278},"verify-the-fix","Verify the fix",[68,281,282],{},"Run only this rule after editing so the report stays focused on the diagnostic you are closing:",[91,284,288],{"className":285,"code":286,"language":287,"meta":96,"style":96},"language-bash shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","pnpm nuxt doctor --rules vueuse\u002Fprefer-use-observers\n","bash",[98,289,290],{"__ignoreMap":96},[101,291,292,296,299,302,305],{"class":103,"line":104},[101,293,295],{"class":294},"sBMFI","pnpm",[101,297,298],{"class":128}," nuxt",[101,300,301],{"class":128}," doctor",[101,303,304],{"class":128}," --rules",[101,306,307],{"class":128}," vueuse\u002Fprefer-use-observers\n",[63,309,311],{"id":310},"useful-links","Useful links",[313,314,315],"ul",{},[316,317,318],"li",{},[319,320,323],"a",{"href":54,"rel":321},[322],"nofollow","Upstream docs",[63,325,327],{"id":326},"related-rule","Related rule",[313,329,330],{},[316,331,332],{},[319,333,334],{"href":58},[98,335,57],{},[337,338,339],"style",{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}",{"title":96,"searchDepth":137,"depth":137,"links":341},[342,343,344,347,348,349],{"id":65,"depth":137,"text":66},{"id":73,"depth":137,"text":74},{"id":80,"depth":137,"text":81,"children":345},[346],{"id":85,"depth":157,"text":86},{"id":278,"depth":137,"text":279},{"id":310,"depth":137,"text":311},{"id":326,"depth":137,"text":327},"NUXT0065","Finds VueUse project code that should use the supported use observers pattern instead.","md","nuxt",{},true,"\u002Fdiagnostics\u002Fnuxt0065",{"title":46,"description":351},"diagnostics\u002FNUXT0065","CN1C5BDAGco_bvVQo96A5wxeh_oMoxrfGau-6m_BXjg",1791309505533]