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