[{"data":1,"prerenderedAt":365},["ShallowReactive",2],{"navigation_docs":3,"diagnostic-content-NUXT0071":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":354,"description":355,"docsUrl":54,"extension":356,"fix":357,"framework":358,"meta":359,"navigation":360,"pack":56,"path":361,"ruleId":57,"rulePath":58,"seo":362,"severity":59,"source":60,"sourceUrl":61,"stem":363,"why":70,"__hash__":364},"diagnostics\u002Fdiagnostics\u002FNUXT0071.md","NUXT0071: Use useEventListener for DOM events",{"type":48,"value":49,"toc":344},"minimark",[50,62,67,71,75,83,87,92,95,222,225,280,284,287,312,316,328,332,340],[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\u002FuseEventListener\u002F#usage","suggestion","vite-doctor\u002Fvueuse","vueuse\u002Fprefer-useevent-listener","\u002Fnuxt\u002Frules\u002Fbrowser-api\u002Fprefer-useevent-listener","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,78,82],{},"Use VueUse ",[79,80,81],"code",{},"useEventListener()"," so the listener is removed with the component scope.",[63,84,86],{"id":85},"example","Example",[88,89,91],"h3",{"id":90},"use-vueuse-event-listeners","Use VueUse event listeners",[68,93,94],{},"Before",[96,97,102],"pre",{"className":98,"code":99,"language":100,"meta":101,"style":101},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript setup lang=\"ts\">\nonMounted(() => window.addEventListener('resize', onResize))\nonBeforeUnmount(() => window.removeEventListener('resize', onResize))\n\u003C\u002Fscript>\n","vue","",[79,103,104,139,181,212],{"__ignoreMap":101},[105,106,109,113,117,121,124,127,130,134,136],"span",{"class":107,"line":108},"line",1,[105,110,112],{"class":111},"sMK4o","\u003C",[105,114,116],{"class":115},"swJcz","script",[105,118,120],{"class":119},"spNyl"," setup",[105,122,123],{"class":119}," lang",[105,125,126],{"class":111},"=",[105,128,129],{"class":111},"\"",[105,131,133],{"class":132},"sfazB","ts",[105,135,129],{"class":111},[105,137,138],{"class":111},">\n",[105,140,142,146,150,153,156,159,162,165,167,170,173,175,178],{"class":107,"line":141},2,[105,143,145],{"class":144},"s2Zo4","onMounted",[105,147,149],{"class":148},"sTEyZ","(",[105,151,152],{"class":111},"()",[105,154,155],{"class":119}," =>",[105,157,158],{"class":148}," window",[105,160,161],{"class":111},".",[105,163,164],{"class":144},"addEventListener",[105,166,149],{"class":148},[105,168,169],{"class":111},"'",[105,171,172],{"class":132},"resize",[105,174,169],{"class":111},[105,176,177],{"class":111},",",[105,179,180],{"class":148}," onResize))\n",[105,182,184,187,189,191,193,195,197,200,202,204,206,208,210],{"class":107,"line":183},3,[105,185,186],{"class":144},"onBeforeUnmount",[105,188,149],{"class":148},[105,190,152],{"class":111},[105,192,155],{"class":119},[105,194,158],{"class":148},[105,196,161],{"class":111},[105,198,199],{"class":144},"removeEventListener",[105,201,149],{"class":148},[105,203,169],{"class":111},[105,205,172],{"class":132},[105,207,169],{"class":111},[105,209,177],{"class":111},[105,211,180],{"class":148},[105,213,215,218,220],{"class":107,"line":214},4,[105,216,217],{"class":111},"\u003C\u002F",[105,219,116],{"class":115},[105,221,138],{"class":111},[68,223,224],{},"After",[96,226,228],{"className":98,"code":227,"language":100,"meta":101,"style":101},"\u003Cscript setup lang=\"ts\">\nuseEventListener(window, 'resize', onResize)\n\u003C\u002Fscript>\n",[79,229,230,250,272],{"__ignoreMap":101},[105,231,232,234,236,238,240,242,244,246,248],{"class":107,"line":108},[105,233,112],{"class":111},[105,235,116],{"class":115},[105,237,120],{"class":119},[105,239,123],{"class":119},[105,241,126],{"class":111},[105,243,129],{"class":111},[105,245,133],{"class":132},[105,247,129],{"class":111},[105,249,138],{"class":111},[105,251,252,255,258,260,263,265,267,269],{"class":107,"line":141},[105,253,254],{"class":144},"useEventListener",[105,256,257],{"class":148},"(window",[105,259,177],{"class":111},[105,261,262],{"class":111}," '",[105,264,172],{"class":132},[105,266,169],{"class":111},[105,268,177],{"class":111},[105,270,271],{"class":148}," onResize)\n",[105,273,274,276,278],{"class":107,"line":183},[105,275,217],{"class":111},[105,277,116],{"class":115},[105,279,138],{"class":111},[63,281,283],{"id":282},"verify-the-fix","Verify the fix",[68,285,286],{},"Run only this rule after editing so the report stays focused on the diagnostic you are closing:",[96,288,292],{"className":289,"code":290,"language":291,"meta":101,"style":101},"language-bash shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","pnpm nuxt doctor --rules vueuse\u002Fprefer-useevent-listener\n","bash",[79,293,294],{"__ignoreMap":101},[105,295,296,300,303,306,309],{"class":107,"line":108},[105,297,299],{"class":298},"sBMFI","pnpm",[105,301,302],{"class":132}," nuxt",[105,304,305],{"class":132}," doctor",[105,307,308],{"class":132}," --rules",[105,310,311],{"class":132}," vueuse\u002Fprefer-useevent-listener\n",[63,313,315],{"id":314},"useful-links","Useful links",[317,318,319],"ul",{},[320,321,322],"li",{},[323,324,327],"a",{"href":54,"rel":325},[326],"nofollow","Upstream docs",[63,329,331],{"id":330},"related-rule","Related rule",[317,333,334],{},[320,335,336],{},[323,337,338],{"href":58},[79,339,57],{},[341,342,343],"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":101,"searchDepth":141,"depth":141,"links":345},[346,347,348,351,352,353],{"id":65,"depth":141,"text":66},{"id":73,"depth":141,"text":74},{"id":85,"depth":141,"text":86,"children":349},[350],{"id":90,"depth":183,"text":91},{"id":282,"depth":141,"text":283},{"id":314,"depth":141,"text":315},{"id":330,"depth":141,"text":331},"NUXT0071","Finds VueUse project code that should use the supported useEvent listener pattern instead.","md","Use VueUse useEventListener() so the listener is removed with the component scope.","nuxt",{},true,"\u002Fdiagnostics\u002Fnuxt0071",{"title":46,"description":355},"diagnostics\u002FNUXT0071","MkEq2gGXRkrLh-KCaaZcinsoPM-y1yRkFzOU8SsuKvs",1791309505386]