[{"data":1,"prerenderedAt":413},["ShallowReactive",2],{"navigation_docs":3,"diagnostic-content-VUE0021":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":404,"description":405,"docsUrl":54,"extension":406,"fix":77,"framework":95,"meta":407,"navigation":408,"pack":56,"path":409,"ruleId":57,"rulePath":58,"seo":410,"severity":59,"source":60,"sourceUrl":61,"stem":411,"why":70,"__hash__":412},"diagnostics\u002Fdiagnostics\u002FVUE0021.md","VUE0021: Clean up watcher side effects",{"type":48,"value":49,"toc":394},"minimark",[50,62,67,71,75,78,82,87,90,206,209,324,328,331,362,366,378,382,390],[51,52],"rule-metadata",{"category":53,"docsUrl":54,"fix":55,"pack":56,"ruleId":57,"rulePath":58,"severity":59,"source":60,"sourceUrl":61},"watchers","https:\u002F\u002Fvuejs.org\u002Fguide\u002Fessentials\u002Fwatchers.html#side-effect-cleanup","suggestion","vite-doctor\u002Fvue","vue\u002Fwatch\u002Frequire-side-effect-cleanup","\u002Fvue\u002Frules\u002Fwatch\u002Frequire-side-effect-cleanup","warn","src\u002Frule-packs\u002Fvue\u002Frules\u002Fvue\u002Frequire-watcher-cleanup.ts","https:\u002F\u002Fgithub.com\u002Fonmax\u002Fvite-doctor\u002Fblob\u002Fmain\u002Fsrc\u002Frule-packs\u002Fvue\u002Frules\u002Fvue\u002Frequire-watcher-cleanup.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],{},"Add side effect cleanup where Vue expects it, close to the code that depends on it.",[63,79,81],{"id":80},"example","Example",[83,84,86],"h3",{"id":85},"clean-up-watcher-side-effects","Clean up watcher side effects",[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\">\nwatch(query, () => {\n  const timer = setTimeout(search, 300)\n})\n\u003C\u002Fscript>\n","vue","",[98,99,100,135,158,188,196],"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,155],{"class":103,"line":137},2,[101,139,141],{"class":140},"s2Zo4","watch",[101,143,145],{"class":144},"sTEyZ","(query",[101,147,148],{"class":107},",",[101,150,151],{"class":107}," ()",[101,153,154],{"class":115}," =>",[101,156,157],{"class":107}," {\n",[101,159,161,164,167,170,173,176,179,181,185],{"class":103,"line":160},3,[101,162,163],{"class":115},"  const",[101,165,166],{"class":144}," timer",[101,168,169],{"class":107}," =",[101,171,172],{"class":140}," setTimeout",[101,174,175],{"class":111},"(",[101,177,178],{"class":144},"search",[101,180,148],{"class":107},[101,182,184],{"class":183},"sbssI"," 300",[101,186,187],{"class":111},")\n",[101,189,191,194],{"class":103,"line":190},4,[101,192,193],{"class":107},"}",[101,195,187],{"class":144},[101,197,199,202,204],{"class":103,"line":198},5,[101,200,201],{"class":107},"\u003C\u002F",[101,203,112],{"class":111},[101,205,134],{"class":107},[68,207,208],{},"After",[91,210,212],{"className":93,"code":211,"language":95,"meta":96,"style":96},"\u003Cscript setup lang=\"ts\">\nwatch(query, (_, __, onCleanup) => {\n  const timer = setTimeout(search, 300)\n  onCleanup(() => clearTimeout(timer))\n})\n\u003C\u002Fscript>\n",[98,213,214,234,266,286,309,315],{"__ignoreMap":96},[101,215,216,218,220,222,224,226,228,230,232],{"class":103,"line":104},[101,217,108],{"class":107},[101,219,112],{"class":111},[101,221,116],{"class":115},[101,223,119],{"class":115},[101,225,122],{"class":107},[101,227,125],{"class":107},[101,229,129],{"class":128},[101,231,125],{"class":107},[101,233,134],{"class":107},[101,235,236,238,240,242,245,249,251,254,256,259,262,264],{"class":103,"line":137},[101,237,141],{"class":140},[101,239,145],{"class":144},[101,241,148],{"class":107},[101,243,244],{"class":107}," (",[101,246,248],{"class":247},"sHdIc","_",[101,250,148],{"class":107},[101,252,253],{"class":247}," __",[101,255,148],{"class":107},[101,257,258],{"class":247}," onCleanup",[101,260,261],{"class":107},")",[101,263,154],{"class":115},[101,265,157],{"class":107},[101,267,268,270,272,274,276,278,280,282,284],{"class":103,"line":160},[101,269,163],{"class":115},[101,271,166],{"class":144},[101,273,169],{"class":107},[101,275,172],{"class":140},[101,277,175],{"class":111},[101,279,178],{"class":144},[101,281,148],{"class":107},[101,283,184],{"class":183},[101,285,187],{"class":111},[101,287,288,291,293,296,298,301,303,306],{"class":103,"line":190},[101,289,290],{"class":140},"  onCleanup",[101,292,175],{"class":111},[101,294,295],{"class":107},"()",[101,297,154],{"class":115},[101,299,300],{"class":140}," clearTimeout",[101,302,175],{"class":111},[101,304,305],{"class":144},"timer",[101,307,308],{"class":111},"))\n",[101,310,311,313],{"class":103,"line":198},[101,312,193],{"class":107},[101,314,187],{"class":144},[101,316,318,320,322],{"class":103,"line":317},6,[101,319,201],{"class":107},[101,321,112],{"class":111},[101,323,134],{"class":107},[63,325,327],{"id":326},"verify-the-fix","Verify the fix",[68,329,330],{},"Run only this rule after editing so the report stays focused on the diagnostic you are closing:",[91,332,336],{"className":333,"code":334,"language":335,"meta":96,"style":96},"language-bash shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","pnpm vite-doctor . --framework vue --rules vue\u002Fwatch\u002Frequire-side-effect-cleanup\n","bash",[98,337,338],{"__ignoreMap":96},[101,339,340,344,347,350,353,356,359],{"class":103,"line":104},[101,341,343],{"class":342},"sBMFI","pnpm",[101,345,346],{"class":128}," vite-doctor",[101,348,349],{"class":128}," .",[101,351,352],{"class":128}," --framework",[101,354,355],{"class":128}," vue",[101,357,358],{"class":128}," --rules",[101,360,361],{"class":128}," vue\u002Fwatch\u002Frequire-side-effect-cleanup\n",[63,363,365],{"id":364},"useful-links","Useful links",[367,368,369],"ul",{},[370,371,372],"li",{},[373,374,377],"a",{"href":54,"rel":375},[376],"nofollow","Upstream docs",[63,379,381],{"id":380},"related-rule","Related rule",[367,383,384],{},[370,385,386],{},[373,387,388],{"href":58},[98,389,57],{},[391,392,393],"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 pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}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 .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}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":395},[396,397,398,401,402,403],{"id":65,"depth":137,"text":66},{"id":73,"depth":137,"text":74},{"id":80,"depth":137,"text":81,"children":399},[400],{"id":85,"depth":160,"text":86},{"id":326,"depth":137,"text":327},{"id":364,"depth":137,"text":365},{"id":380,"depth":137,"text":381},"VUE0021","Checks that Vue watch code includes the side effect cleanup needed for predictable behavior.","md",{},true,"\u002Fdiagnostics\u002Fvue0021",{"title":46,"description":405},"diagnostics\u002FVUE0021","34ehqbT3ixJKt4E3xT3xC7455UusKgVuYFuM8fXCCj4",1791309481807]