[{"data":1,"prerenderedAt":3243},["ShallowReactive",2],{"navigation":3,"-blog-nuxt-scripts":1107,"-blog-nuxt-scripts-surround":3238},[4,1018],{"title":5,"titleTemplate":6,"icon":7,"path":8,"stem":9,"children":10,"page":108},"Docs",null,"i-lucide-bookmark","/docs","docs",[11,109,345,805,897,934,976],{"title":12,"titleTemplate":13,"icon":14,"path":15,"stem":16,"children":17,"page":108},"Get Started","%s · Get Started with Nuxt","i-lucide-rocket","/docs/getting-started","docs/1.getting-started",[18,23,28,33,38,43,48,53,58,63,68,73,78,83,88,93,98,103],{"title":19,"path":20,"stem":21,"titleTemplate":6,"icon":22},"Introduction","/docs/getting-started/introduction","docs/1.getting-started/01.introduction","i-lucide-info",{"title":24,"path":25,"stem":26,"titleTemplate":6,"icon":27},"Installation","/docs/getting-started/installation","docs/1.getting-started/02.installation","i-lucide-play",{"title":29,"path":30,"stem":31,"titleTemplate":6,"icon":32},"Configuration","/docs/getting-started/configuration","docs/1.getting-started/03.configuration","i-lucide-cog",{"title":34,"path":35,"stem":36,"titleTemplate":6,"icon":37},"Views","/docs/getting-started/views","docs/1.getting-started/04.views","i-lucide-panels-top-left",{"title":39,"path":40,"stem":41,"titleTemplate":6,"icon":42},"Assets","/docs/getting-started/assets","docs/1.getting-started/05.assets","i-lucide-image",{"title":44,"path":45,"stem":46,"titleTemplate":6,"icon":47},"Styling","/docs/getting-started/styling","docs/1.getting-started/06.styling","i-lucide-palette",{"title":49,"path":50,"stem":51,"titleTemplate":6,"icon":52},"Routing","/docs/getting-started/routing","docs/1.getting-started/07.routing","i-lucide-milestone",{"title":54,"path":55,"stem":56,"titleTemplate":6,"icon":57},"SEO and Meta","/docs/getting-started/seo-meta","docs/1.getting-started/08.seo-meta","i-lucide-file-search",{"title":59,"path":60,"stem":61,"titleTemplate":6,"icon":62},"Transitions","/docs/getting-started/transitions","docs/1.getting-started/09.transitions","i-lucide-toggle-right",{"title":64,"path":65,"stem":66,"titleTemplate":6,"icon":67},"Data Fetching","/docs/getting-started/data-fetching","docs/1.getting-started/10.data-fetching","i-lucide-cable",{"title":69,"path":70,"stem":71,"titleTemplate":6,"icon":72},"State Management","/docs/getting-started/state-management","docs/1.getting-started/11.state-management","i-lucide-database",{"title":74,"path":75,"stem":76,"titleTemplate":6,"icon":77},"Error Handling","/docs/getting-started/error-handling","docs/1.getting-started/12.error-handling","i-lucide-bug-off",{"title":79,"path":80,"stem":81,"titleTemplate":6,"icon":82},"Server","/docs/getting-started/server","docs/1.getting-started/13.server","i-lucide-pc-case",{"title":84,"path":85,"stem":86,"titleTemplate":6,"icon":87},"Layers","/docs/getting-started/layers","docs/1.getting-started/14.layers","i-lucide-layers",{"title":89,"path":90,"stem":91,"titleTemplate":6,"icon":92},"Prerendering","/docs/getting-started/prerendering","docs/1.getting-started/15.prerendering","i-lucide-file-code-2",{"title":94,"path":95,"stem":96,"titleTemplate":6,"icon":97},"Deployment","/docs/getting-started/deployment","docs/1.getting-started/16.deployment","i-lucide-cloud",{"title":99,"path":100,"stem":101,"titleTemplate":6,"icon":102},"Testing","/docs/getting-started/testing","docs/1.getting-started/17.testing","i-lucide-circle-check",{"title":104,"path":105,"stem":106,"titleTemplate":6,"icon":107},"Upgrade Guide","/docs/getting-started/upgrade","docs/1.getting-started/18.upgrade","i-lucide-circle-arrow-up",false,{"title":110,"titleTemplate":6,"icon":111,"path":112,"stem":113,"children":114,"page":108},"Guide","i-lucide-book-open","/docs/guide","docs/2.guide",[115,158,271,322],{"title":116,"titleTemplate":117,"icon":118,"path":119,"stem":120,"children":121,"page":108},"Key Concepts","%s · Nuxt Concepts","i-lucide-medal","/docs/guide/concepts","docs/2.guide/1.concepts",[122,126,130,134,138,142,146,150,154],{"title":123,"path":124,"stem":125,"titleTemplate":6},"Auto-imports","/docs/guide/concepts/auto-imports","docs/2.guide/1.concepts/1.auto-imports",{"title":127,"path":128,"stem":129,"titleTemplate":6},"Nuxt Lifecycle","/docs/guide/concepts/nuxt-lifecycle","docs/2.guide/1.concepts/10.nuxt-lifecycle",{"title":131,"path":132,"stem":133,"titleTemplate":6},"Vue.js Development","/docs/guide/concepts/vuejs-development","docs/2.guide/1.concepts/2.vuejs-development",{"title":135,"path":136,"stem":137,"titleTemplate":6},"Rendering Modes","/docs/guide/concepts/rendering","docs/2.guide/1.concepts/3.rendering",{"title":139,"path":140,"stem":141,"titleTemplate":6},"Server Engine","/docs/guide/concepts/server-engine","docs/2.guide/1.concepts/4.server-engine",{"title":143,"path":144,"stem":145,"titleTemplate":6},"Modules","/docs/guide/concepts/modules","docs/2.guide/1.concepts/5.modules",{"title":147,"path":148,"stem":149,"titleTemplate":6},"ES Modules","/docs/guide/concepts/esm","docs/2.guide/1.concepts/7.esm",{"title":151,"path":152,"stem":153,"titleTemplate":6},"TypeScript","/docs/guide/concepts/typescript","docs/2.guide/1.concepts/8.typescript",{"title":155,"path":156,"stem":157,"titleTemplate":6},"Code Style","/docs/guide/concepts/code-style","docs/2.guide/1.concepts/9.code-style",{"title":159,"titleTemplate":160,"icon":161,"path":162,"stem":163,"children":164,"page":108},"Directory Structure","%s · Nuxt Directory Structure","i-lucide-folders","/docs/guide/directory-structure","docs/2.guide/2.directory-structure",[165,170,174,178,182,186,190,194,198,202,206,210,214,218,222,226,230,235,239,243,247,251,255,259,263,267],{"title":166,"path":167,"stem":168,"titleTemplate":6,"icon":169},".nuxt","/docs/guide/directory-structure/nuxt","docs/2.guide/2.directory-structure/0.nuxt","i-lucide-folder",{"title":171,"path":172,"stem":173,"titleTemplate":6,"icon":169},".output","/docs/guide/directory-structure/output","docs/2.guide/2.directory-structure/0.output",{"title":175,"path":176,"stem":177,"titleTemplate":6,"icon":169},"assets","/docs/guide/directory-structure/assets","docs/2.guide/2.directory-structure/1.assets",{"title":179,"path":180,"stem":181,"titleTemplate":6,"icon":169},"components","/docs/guide/directory-structure/components","docs/2.guide/2.directory-structure/1.components",{"title":183,"path":184,"stem":185,"titleTemplate":6,"icon":169},"composables","/docs/guide/directory-structure/composables","docs/2.guide/2.directory-structure/1.composables",{"title":187,"path":188,"stem":189,"titleTemplate":6,"icon":169},"content","/docs/guide/directory-structure/content","docs/2.guide/2.directory-structure/1.content",{"title":191,"path":192,"stem":193,"titleTemplate":6,"icon":169},"layouts","/docs/guide/directory-structure/layouts","docs/2.guide/2.directory-structure/1.layouts",{"title":195,"path":196,"stem":197,"titleTemplate":6,"icon":169},"middleware","/docs/guide/directory-structure/middleware","docs/2.guide/2.directory-structure/1.middleware",{"title":199,"path":200,"stem":201,"titleTemplate":6,"icon":169},"modules","/docs/guide/directory-structure/modules","docs/2.guide/2.directory-structure/1.modules",{"title":203,"path":204,"stem":205,"titleTemplate":6,"icon":169},"node_modules","/docs/guide/directory-structure/node_modules","docs/2.guide/2.directory-structure/1.node_modules",{"title":207,"path":208,"stem":209,"titleTemplate":6,"icon":169},"pages","/docs/guide/directory-structure/pages","docs/2.guide/2.directory-structure/1.pages",{"title":211,"path":212,"stem":213,"titleTemplate":6,"icon":169},"plugins","/docs/guide/directory-structure/plugins","docs/2.guide/2.directory-structure/1.plugins",{"title":215,"path":216,"stem":217,"titleTemplate":6,"icon":169},"public","/docs/guide/directory-structure/public","docs/2.guide/2.directory-structure/1.public",{"title":219,"path":220,"stem":221,"titleTemplate":6,"icon":169},"server","/docs/guide/directory-structure/server","docs/2.guide/2.directory-structure/1.server",{"title":223,"path":224,"stem":225,"titleTemplate":6,"icon":169},"shared","/docs/guide/directory-structure/shared","docs/2.guide/2.directory-structure/1.shared",{"title":227,"path":228,"stem":229,"titleTemplate":6,"icon":169},"utils","/docs/guide/directory-structure/utils","docs/2.guide/2.directory-structure/1.utils",{"title":231,"path":232,"stem":233,"titleTemplate":6,"icon":234},".env","/docs/guide/directory-structure/env","docs/2.guide/2.directory-structure/2.env","i-lucide-file",{"title":236,"path":237,"stem":238,"titleTemplate":6,"icon":234},".gitignore","/docs/guide/directory-structure/gitignore","docs/2.guide/2.directory-structure/2.gitignore",{"title":240,"path":241,"stem":242,"titleTemplate":6,"icon":234},".nuxtignore","/docs/guide/directory-structure/nuxtignore","docs/2.guide/2.directory-structure/2.nuxtignore",{"title":244,"path":245,"stem":246,"titleTemplate":6,"icon":234},".nuxtrc","/docs/guide/directory-structure/nuxtrc","docs/2.guide/2.directory-structure/2.nuxtrc",{"title":248,"path":249,"stem":250,"titleTemplate":6,"icon":234},"app.vue","/docs/guide/directory-structure/app","docs/2.guide/2.directory-structure/3.app",{"title":252,"path":253,"stem":254,"titleTemplate":6,"icon":234},"app.config.ts","/docs/guide/directory-structure/app-config","docs/2.guide/2.directory-structure/3.app-config",{"title":256,"path":257,"stem":258,"titleTemplate":6,"icon":234},"error.vue","/docs/guide/directory-structure/error","docs/2.guide/2.directory-structure/3.error",{"title":260,"path":261,"stem":262,"titleTemplate":6,"icon":234},"nuxt.config.ts","/docs/guide/directory-structure/nuxt-config","docs/2.guide/2.directory-structure/3.nuxt-config",{"title":264,"path":265,"stem":266,"titleTemplate":6,"icon":234},"package.json","/docs/guide/directory-structure/package","docs/2.guide/2.directory-structure/3.package",{"title":268,"path":269,"stem":270,"titleTemplate":6,"icon":234},"tsconfig.json","/docs/guide/directory-structure/tsconfig","docs/2.guide/2.directory-structure/3.tsconfig",{"title":272,"titleTemplate":273,"icon":274,"path":275,"stem":276,"children":277,"page":108},"Going Further","%s · Nuxt Advanced","i-lucide-star","/docs/guide/going-further","docs/2.guide/3.going-further",[278,282,286,290,294,298,302,306,310,314,318],{"title":279,"path":280,"stem":281,"titleTemplate":6},"Experimental Features","/docs/guide/going-further/experimental-features","docs/2.guide/3.going-further/1.experimental-features",{"title":283,"path":284,"stem":285,"titleTemplate":6},"Features","/docs/guide/going-further/features","docs/2.guide/3.going-further/1.features",{"title":287,"path":288,"stem":289,"titleTemplate":6},"How Nuxt Works?","/docs/guide/going-further/internals","docs/2.guide/3.going-further/1.internals",{"title":291,"path":292,"stem":293,"titleTemplate":6},"Runtime Config","/docs/guide/going-further/runtime-config","docs/2.guide/3.going-further/10.runtime-config",{"title":295,"path":296,"stem":297,"titleTemplate":6},"Nightly Release Channel","/docs/guide/going-further/nightly-release-channel","docs/2.guide/3.going-further/11.nightly-release-channel",{"title":299,"path":300,"stem":301,"titleTemplate":6},"Lifecycle Hooks","/docs/guide/going-further/hooks","docs/2.guide/3.going-further/2.hooks",{"title":303,"path":304,"stem":305,"titleTemplate":6},"Module Author Guide","/docs/guide/going-further/modules","docs/2.guide/3.going-further/3.modules",{"title":307,"path":308,"stem":309,"titleTemplate":6},"Nuxt Kit","/docs/guide/going-further/kit","docs/2.guide/3.going-further/4.kit",{"title":311,"path":312,"stem":313,"titleTemplate":6},"NuxtApp","/docs/guide/going-further/nuxt-app","docs/2.guide/3.going-further/6.nuxt-app",{"title":315,"path":316,"stem":317,"titleTemplate":6},"Authoring Nuxt Layers","/docs/guide/going-further/layers","docs/2.guide/3.going-further/7.layers",{"title":319,"path":320,"stem":321,"titleTemplate":6},"Debugging","/docs/guide/going-further/debugging","docs/2.guide/3.going-further/9.debugging",{"title":323,"titleTemplate":324,"icon":325,"path":326,"stem":327,"children":328,"page":108},"Recipes","%s · Recipes","i-lucide-cooking-pot","/docs/guide/recipes","docs/2.guide/4.recipes",[329,333,337,341],{"title":330,"path":331,"stem":332,"titleTemplate":6},"Custom Routing","/docs/guide/recipes/custom-routing","docs/2.guide/4.recipes/1.custom-routing",{"title":334,"path":335,"stem":336,"titleTemplate":6},"Vite Plugins","/docs/guide/recipes/vite-plugin","docs/2.guide/4.recipes/2.vite-plugin",{"title":338,"path":339,"stem":340,"titleTemplate":6},"Custom useFetch","/docs/guide/recipes/custom-usefetch","docs/2.guide/4.recipes/3.custom-usefetch",{"title":342,"path":343,"stem":344,"titleTemplate":6},"Sessions and Authentication","/docs/guide/recipes/sessions-and-authentication","docs/2.guide/4.recipes/4.sessions-and-authentication",{"title":346,"titleTemplate":347,"icon":348,"path":349,"stem":350,"children":351,"page":108},"API","%s · Nuxt API","i-lucide-code-xml","/docs/api","docs/3.api",[352,416,539,654,721,787,800],{"title":353,"titleTemplate":354,"icon":355,"path":356,"stem":357,"children":358,"page":108},"Components","%s · Nuxt Components","i-lucide-box","/docs/api/components","docs/3.api/1.components",[359,363,367,371,375,379,384,388,392,396,400,404,408,412],{"title":360,"path":361,"stem":362,"titleTemplate":6},"\u003CClientOnly>","/docs/api/components/client-only","docs/3.api/1.components/1.client-only",{"title":364,"path":365,"stem":366,"titleTemplate":6},"\u003CDevOnly>","/docs/api/components/dev-only","docs/3.api/1.components/1.dev-only",{"title":368,"path":369,"stem":370,"titleTemplate":6},"\u003CNuxtClientFallback>","/docs/api/components/nuxt-client-fallback","docs/3.api/1.components/1.nuxt-client-fallback",{"title":372,"path":373,"stem":374,"titleTemplate":6},"\u003CNuxtPicture>","/docs/api/components/nuxt-picture","docs/3.api/1.components/10.nuxt-picture",{"title":376,"path":377,"stem":378,"titleTemplate":6},"\u003CTeleport>","/docs/api/components/teleports","docs/3.api/1.components/11.teleports",{"title":380,"path":381,"stem":382,"titleTemplate":6,"badge":383},"\u003CNuxtRouteAnnouncer>","/docs/api/components/nuxt-route-announcer","docs/3.api/1.components/12.nuxt-route-announcer","New",{"title":385,"path":386,"stem":387,"titleTemplate":6},"\u003CNuxtPage>","/docs/api/components/nuxt-page","docs/3.api/1.components/2.nuxt-page",{"title":389,"path":390,"stem":391,"titleTemplate":6},"\u003CNuxtLayout>","/docs/api/components/nuxt-layout","docs/3.api/1.components/3.nuxt-layout",{"title":393,"path":394,"stem":395,"titleTemplate":6},"\u003CNuxtLink>","/docs/api/components/nuxt-link","docs/3.api/1.components/4.nuxt-link",{"title":397,"path":398,"stem":399,"titleTemplate":6},"\u003CNuxtLoadingIndicator>","/docs/api/components/nuxt-loading-indicator","docs/3.api/1.components/5.nuxt-loading-indicator",{"title":401,"path":402,"stem":403,"titleTemplate":6},"\u003CNuxtErrorBoundary>","/docs/api/components/nuxt-error-boundary","docs/3.api/1.components/6.nuxt-error-boundary",{"title":405,"path":406,"stem":407,"titleTemplate":6},"\u003CNuxtWelcome>","/docs/api/components/nuxt-welcome","docs/3.api/1.components/7.nuxt-welcome",{"title":409,"path":410,"stem":411,"titleTemplate":6},"\u003CNuxtIsland>","/docs/api/components/nuxt-island","docs/3.api/1.components/8.nuxt-island",{"title":413,"path":414,"stem":415,"titleTemplate":6},"\u003CNuxtImg>","/docs/api/components/nuxt-img","docs/3.api/1.components/9.nuxt-img",{"title":417,"titleTemplate":418,"icon":419,"path":420,"stem":421,"children":422,"page":108},"Composables","%s · Nuxt Composables","i-lucide-arrow-left-right","/docs/api/composables","docs/3.api/2.composables",[423,427,431,435,439,443,447,451,455,459,463,467,471,475,479,483,487,491,495,499,503,507,511,515,519,523,527,531,535],{"title":424,"path":425,"stem":426,"titleTemplate":6},"onPrehydrate","/docs/api/composables/on-prehydrate","docs/3.api/2.composables/on-prehydrate",{"title":428,"path":429,"stem":430,"titleTemplate":6},"useAppConfig","/docs/api/composables/use-app-config","docs/3.api/2.composables/use-app-config",{"title":432,"path":433,"stem":434,"titleTemplate":6},"useAsyncData","/docs/api/composables/use-async-data","docs/3.api/2.composables/use-async-data",{"title":436,"path":437,"stem":438,"titleTemplate":6},"useCookie","/docs/api/composables/use-cookie","docs/3.api/2.composables/use-cookie",{"title":440,"path":441,"stem":442,"titleTemplate":6},"useError","/docs/api/composables/use-error","docs/3.api/2.composables/use-error",{"title":444,"path":445,"stem":446,"titleTemplate":6},"useFetch","/docs/api/composables/use-fetch","docs/3.api/2.composables/use-fetch",{"title":448,"path":449,"stem":450,"titleTemplate":6},"useHead","/docs/api/composables/use-head","docs/3.api/2.composables/use-head",{"title":452,"path":453,"stem":454,"titleTemplate":6},"useHeadSafe","/docs/api/composables/use-head-safe","docs/3.api/2.composables/use-head-safe",{"title":456,"path":457,"stem":458,"titleTemplate":6},"useHydration","/docs/api/composables/use-hydration","docs/3.api/2.composables/use-hydration",{"title":460,"path":461,"stem":462,"titleTemplate":6},"useLazyAsyncData","/docs/api/composables/use-lazy-async-data","docs/3.api/2.composables/use-lazy-async-data",{"title":464,"path":465,"stem":466,"titleTemplate":6},"useLazyFetch","/docs/api/composables/use-lazy-fetch","docs/3.api/2.composables/use-lazy-fetch",{"title":468,"path":469,"stem":470,"titleTemplate":6},"useLoadingIndicator","/docs/api/composables/use-loading-indicator","docs/3.api/2.composables/use-loading-indicator",{"title":472,"path":473,"stem":474,"titleTemplate":6},"useNuxtApp","/docs/api/composables/use-nuxt-app","docs/3.api/2.composables/use-nuxt-app",{"title":476,"path":477,"stem":478,"titleTemplate":6},"useNuxtData","/docs/api/composables/use-nuxt-data","docs/3.api/2.composables/use-nuxt-data",{"title":480,"path":481,"stem":482,"titleTemplate":6},"usePreviewMode","/docs/api/composables/use-preview-mode","docs/3.api/2.composables/use-preview-mode",{"title":484,"path":485,"stem":486,"titleTemplate":6},"useRequestEvent","/docs/api/composables/use-request-event","docs/3.api/2.composables/use-request-event",{"title":488,"path":489,"stem":490,"titleTemplate":6},"useRequestFetch","/docs/api/composables/use-request-fetch","docs/3.api/2.composables/use-request-fetch",{"title":492,"path":493,"stem":494,"titleTemplate":6},"useRequestHeader","/docs/api/composables/use-request-header","docs/3.api/2.composables/use-request-header",{"title":496,"path":497,"stem":498,"titleTemplate":6},"useRequestHeaders","/docs/api/composables/use-request-headers","docs/3.api/2.composables/use-request-headers",{"title":500,"path":501,"stem":502,"titleTemplate":6},"useRequestURL","/docs/api/composables/use-request-url","docs/3.api/2.composables/use-request-url",{"title":504,"path":505,"stem":506,"titleTemplate":6},"useResponseHeader","/docs/api/composables/use-response-header","docs/3.api/2.composables/use-response-header",{"title":508,"path":509,"stem":510,"titleTemplate":6},"useRoute","/docs/api/composables/use-route","docs/3.api/2.composables/use-route",{"title":512,"path":513,"stem":514,"titleTemplate":6,"badge":383},"useRouteAnnouncer","/docs/api/composables/use-route-announcer","docs/3.api/2.composables/use-route-announcer",{"title":516,"path":517,"stem":518,"titleTemplate":6},"useRouter","/docs/api/composables/use-router","docs/3.api/2.composables/use-router",{"title":520,"path":521,"stem":522,"titleTemplate":6},"useRuntimeConfig","/docs/api/composables/use-runtime-config","docs/3.api/2.composables/use-runtime-config",{"title":524,"path":525,"stem":526,"titleTemplate":6},"useRuntimeHook","/docs/api/composables/use-runtime-hook","docs/3.api/2.composables/use-runtime-hook",{"title":528,"path":529,"stem":530,"titleTemplate":6},"useSeoMeta","/docs/api/composables/use-seo-meta","docs/3.api/2.composables/use-seo-meta",{"title":532,"path":533,"stem":534,"titleTemplate":6},"useServerSeoMeta","/docs/api/composables/use-server-seo-meta","docs/3.api/2.composables/use-server-seo-meta",{"title":536,"path":537,"stem":538,"titleTemplate":6},"useState","/docs/api/composables/use-state","docs/3.api/2.composables/use-state",{"title":540,"titleTemplate":541,"icon":542,"path":543,"stem":544,"children":545,"page":108},"Utils","%s · Nuxt Utils","i-lucide-square-function","/docs/api/utils","docs/3.api/3.utils",[546,550,554,558,562,566,570,574,578,582,586,590,594,598,602,606,610,614,618,622,626,630,634,638,642,646,650],{"title":547,"path":548,"stem":549,"titleTemplate":6},"$fetch","/docs/api/utils/dollarfetch","docs/3.api/3.utils/$fetch",{"title":551,"path":552,"stem":553,"titleTemplate":6},"abortNavigation","/docs/api/utils/abort-navigation","docs/3.api/3.utils/abort-navigation",{"title":555,"path":556,"stem":557,"titleTemplate":6},"addRouteMiddleware","/docs/api/utils/add-route-middleware","docs/3.api/3.utils/add-route-middleware",{"title":559,"path":560,"stem":561,"titleTemplate":6,"badge":383},"callOnce","/docs/api/utils/call-once","docs/3.api/3.utils/call-once",{"title":563,"path":564,"stem":565,"titleTemplate":6},"clearError","/docs/api/utils/clear-error","docs/3.api/3.utils/clear-error",{"title":567,"path":568,"stem":569,"titleTemplate":6},"clearNuxtData","/docs/api/utils/clear-nuxt-data","docs/3.api/3.utils/clear-nuxt-data",{"title":571,"path":572,"stem":573,"titleTemplate":6},"clearNuxtState","/docs/api/utils/clear-nuxt-state","docs/3.api/3.utils/clear-nuxt-state",{"title":575,"path":576,"stem":577,"titleTemplate":6},"createError","/docs/api/utils/create-error","docs/3.api/3.utils/create-error",{"title":579,"path":580,"stem":581,"titleTemplate":6},"defineNuxtComponent","/docs/api/utils/define-nuxt-component","docs/3.api/3.utils/define-nuxt-component",{"title":583,"path":584,"stem":585,"titleTemplate":6},"defineNuxtRouteMiddleware","/docs/api/utils/define-nuxt-route-middleware","docs/3.api/3.utils/define-nuxt-route-middleware",{"title":587,"path":588,"stem":589,"titleTemplate":6},"definePageMeta","/docs/api/utils/define-page-meta","docs/3.api/3.utils/define-page-meta",{"title":591,"path":592,"stem":593,"titleTemplate":6},"defineRouteRules","/docs/api/utils/define-route-rules","docs/3.api/3.utils/define-route-rules",{"title":595,"path":596,"stem":597,"titleTemplate":6},"navigateTo","/docs/api/utils/navigate-to","docs/3.api/3.utils/navigate-to",{"title":599,"path":600,"stem":601,"titleTemplate":6},"onBeforeRouteLeave","/docs/api/utils/on-before-route-leave","docs/3.api/3.utils/on-before-route-leave",{"title":603,"path":604,"stem":605,"titleTemplate":6},"onBeforeRouteUpdate","/docs/api/utils/on-before-route-update","docs/3.api/3.utils/on-before-route-update",{"title":607,"path":608,"stem":609,"titleTemplate":6},"onNuxtReady","/docs/api/utils/on-nuxt-ready","docs/3.api/3.utils/on-nuxt-ready",{"title":611,"path":612,"stem":613,"titleTemplate":6},"prefetchComponents","/docs/api/utils/prefetch-components","docs/3.api/3.utils/prefetch-components",{"title":615,"path":616,"stem":617,"titleTemplate":6},"preloadComponents","/docs/api/utils/preload-components","docs/3.api/3.utils/preload-components",{"title":619,"path":620,"stem":621,"titleTemplate":6},"preloadRouteComponents","/docs/api/utils/preload-route-components","docs/3.api/3.utils/preload-route-components",{"title":623,"path":624,"stem":625,"titleTemplate":6},"prerenderRoutes","/docs/api/utils/prerender-routes","docs/3.api/3.utils/prerender-routes",{"title":627,"path":628,"stem":629,"titleTemplate":6,"badge":383},"refreshCookie","/docs/api/utils/refresh-cookie","docs/3.api/3.utils/refresh-cookie",{"title":631,"path":632,"stem":633,"titleTemplate":6},"refreshNuxtData","/docs/api/utils/refresh-nuxt-data","docs/3.api/3.utils/refresh-nuxt-data",{"title":635,"path":636,"stem":637,"titleTemplate":6},"reloadNuxtApp","/docs/api/utils/reload-nuxt-app","docs/3.api/3.utils/reload-nuxt-app",{"title":639,"path":640,"stem":641,"titleTemplate":6},"setPageLayout","/docs/api/utils/set-page-layout","docs/3.api/3.utils/set-page-layout",{"title":643,"path":644,"stem":645,"titleTemplate":6},"setResponseStatus","/docs/api/utils/set-response-status","docs/3.api/3.utils/set-response-status",{"title":647,"path":648,"stem":649,"titleTemplate":6},"showError","/docs/api/utils/show-error","docs/3.api/3.utils/show-error",{"title":651,"path":652,"stem":653,"titleTemplate":6},"updateAppConfig","/docs/api/utils/update-app-config","docs/3.api/3.utils/update-app-config",{"title":655,"titleTemplate":656,"icon":657,"path":658,"stem":659,"children":660,"page":108},"Commands","%s · Nuxt Commands","i-lucide-square-terminal","/docs/api/commands","docs/3.api/4.commands",[661,665,669,673,677,681,685,689,693,697,701,705,709,713,717],{"title":662,"path":663,"stem":664,"titleTemplate":6},"nuxi add","/docs/api/commands/add","docs/3.api/4.commands/add",{"title":666,"path":667,"stem":668,"titleTemplate":6},"nuxi analyze","/docs/api/commands/analyze","docs/3.api/4.commands/analyze",{"title":670,"path":671,"stem":672,"titleTemplate":6},"nuxi build","/docs/api/commands/build","docs/3.api/4.commands/build",{"title":674,"path":675,"stem":676,"titleTemplate":6},"nuxi build-module","/docs/api/commands/build-module","docs/3.api/4.commands/build-module",{"title":678,"path":679,"stem":680,"titleTemplate":6},"nuxi cleanup","/docs/api/commands/cleanup","docs/3.api/4.commands/cleanup",{"title":682,"path":683,"stem":684,"titleTemplate":6},"nuxi dev","/docs/api/commands/dev","docs/3.api/4.commands/dev",{"title":686,"path":687,"stem":688,"titleTemplate":6},"nuxi devtools","/docs/api/commands/devtools","docs/3.api/4.commands/devtools",{"title":690,"path":691,"stem":692,"titleTemplate":6},"nuxi generate","/docs/api/commands/generate","docs/3.api/4.commands/generate",{"title":694,"path":695,"stem":696,"titleTemplate":6},"nuxi info","/docs/api/commands/info","docs/3.api/4.commands/info",{"title":698,"path":699,"stem":700,"titleTemplate":6},"nuxi init","/docs/api/commands/init","docs/3.api/4.commands/init",{"title":702,"path":703,"stem":704,"titleTemplate":6},"nuxi module","/docs/api/commands/module","docs/3.api/4.commands/module",{"title":706,"path":707,"stem":708,"titleTemplate":6},"nuxi prepare","/docs/api/commands/prepare","docs/3.api/4.commands/prepare",{"title":710,"path":711,"stem":712,"titleTemplate":6},"nuxi preview","/docs/api/commands/preview","docs/3.api/4.commands/preview",{"title":714,"path":715,"stem":716,"titleTemplate":6},"nuxi typecheck","/docs/api/commands/typecheck","docs/3.api/4.commands/typecheck",{"title":718,"path":719,"stem":720,"titleTemplate":6},"nuxi upgrade","/docs/api/commands/upgrade","docs/3.api/4.commands/upgrade",{"title":307,"titleTemplate":722,"icon":723,"path":724,"stem":725,"children":726,"page":108},"%s · Nuxt Kit","i-lucide-package","/docs/api/kit","docs/3.api/5.kit",[727,730,733,737,741,745,749,753,757,761,765,768,771,775,779,783],{"title":143,"path":728,"stem":729,"titleTemplate":6},"/docs/api/kit/modules","docs/3.api/5.kit/1.modules",{"title":291,"path":731,"stem":732,"titleTemplate":6},"/docs/api/kit/runtime-config","docs/3.api/5.kit/10.runtime-config",{"title":734,"path":735,"stem":736,"titleTemplate":6},"Templates","/docs/api/kit/templates","docs/3.api/5.kit/10.templates",{"title":738,"path":739,"stem":740,"titleTemplate":6},"Nitro","/docs/api/kit/nitro","docs/3.api/5.kit/11.nitro",{"title":742,"path":743,"stem":744,"titleTemplate":6},"Resolving","/docs/api/kit/resolving","docs/3.api/5.kit/12.resolving",{"title":746,"path":747,"stem":748,"titleTemplate":6},"Logging","/docs/api/kit/logging","docs/3.api/5.kit/13.logging",{"title":750,"path":751,"stem":752,"titleTemplate":6},"Builder","/docs/api/kit/builder","docs/3.api/5.kit/14.builder",{"title":754,"path":755,"stem":756,"titleTemplate":6},"Examples","/docs/api/kit/examples","docs/3.api/5.kit/15.examples",{"title":758,"path":759,"stem":760,"titleTemplate":6},"Programmatic Usage","/docs/api/kit/programmatic","docs/3.api/5.kit/2.programmatic",{"title":762,"path":763,"stem":764,"titleTemplate":6},"Compatibility","/docs/api/kit/compatibility","docs/3.api/5.kit/3.compatibility",{"title":123,"path":766,"stem":767,"titleTemplate":6},"/docs/api/kit/autoimports","docs/3.api/5.kit/4.autoimports",{"title":353,"path":769,"stem":770,"titleTemplate":6},"/docs/api/kit/components","docs/3.api/5.kit/5.components",{"title":772,"path":773,"stem":774,"titleTemplate":6},"Context","/docs/api/kit/context","docs/3.api/5.kit/6.context",{"title":776,"path":777,"stem":778,"titleTemplate":6},"Pages","/docs/api/kit/pages","docs/3.api/5.kit/7.pages",{"title":780,"path":781,"stem":782,"titleTemplate":6},"Layout","/docs/api/kit/layout","docs/3.api/5.kit/8.layout",{"title":784,"path":785,"stem":786,"titleTemplate":6},"Plugins","/docs/api/kit/plugins","docs/3.api/5.kit/9.plugins",{"title":788,"titleTemplate":6,"icon":789,"path":790,"stem":791,"children":792,"page":108},"Advanced","i-lucide-brain","/docs/api/advanced","docs/3.api/6.advanced",[793,796],{"title":299,"path":794,"stem":795,"titleTemplate":6},"/docs/api/advanced/hooks","docs/3.api/6.advanced/1.hooks",{"title":797,"path":798,"stem":799,"titleTemplate":6},"Import meta","/docs/api/advanced/import-meta","docs/3.api/6.advanced/2.import-meta",{"title":801,"path":802,"stem":803,"titleTemplate":804,"icon":32},"Nuxt Configuration","/docs/api/nuxt-config","docs/3.api/6.nuxt-config","%s",{"title":754,"titleTemplate":806,"icon":807,"path":808,"stem":809,"children":810,"page":108},"%s · Nuxt Examples","i-lucide-app-window-mac","/docs/examples","docs/4.examples",[811,815,837,852,888],{"title":812,"path":813,"stem":814,"titleTemplate":6},"Hello World","/docs/examples/hello-world","docs/4.examples/0.hello-world",{"title":283,"path":816,"stem":817,"children":818,"page":108},"/docs/examples/features","docs/4.examples/1.features",[819,823,826,829,833],{"title":820,"path":821,"stem":822,"titleTemplate":6},"Auto Imports","/docs/examples/features/auto-imports","docs/4.examples/1.features/1.auto-imports",{"title":64,"path":824,"stem":825,"titleTemplate":6},"/docs/examples/features/data-fetching","docs/4.examples/1.features/2.data-fetching",{"title":69,"path":827,"stem":828,"titleTemplate":6},"/docs/examples/features/state-management","docs/4.examples/1.features/3.state-management",{"title":830,"path":831,"stem":832,"titleTemplate":6},"Meta Tags","/docs/examples/features/meta-tags","docs/4.examples/1.features/4.meta-tags",{"title":834,"path":835,"stem":836,"titleTemplate":6},"Layouts","/docs/examples/features/layouts","docs/4.examples/1.features/5.layouts",{"title":49,"path":838,"stem":839,"children":840,"page":108},"/docs/examples/routing","docs/4.examples/2.routing",[841,845,848],{"title":842,"path":843,"stem":844,"titleTemplate":6},"Middleware","/docs/examples/routing/middleware","docs/4.examples/2.routing/middleware",{"title":776,"path":846,"stem":847,"titleTemplate":6},"/docs/examples/routing/pages","docs/4.examples/2.routing/pages",{"title":849,"path":850,"stem":851,"titleTemplate":6},"Universal Router","/docs/examples/routing/universal-router","docs/4.examples/2.routing/universal-router",{"title":788,"path":853,"stem":854,"children":855,"page":108},"/docs/examples/advanced","docs/4.examples/4.advanced",[856,859,862,866,870,874,878,881,884],{"title":84,"path":857,"stem":858,"titleTemplate":6},"/docs/examples/advanced/config-extends","docs/4.examples/4.advanced/config-extends",{"title":74,"path":860,"stem":861,"titleTemplate":6},"/docs/examples/advanced/error-handling","docs/4.examples/4.advanced/error-handling",{"title":863,"path":864,"stem":865,"titleTemplate":6},"JSX / TSX","/docs/examples/advanced/jsx","docs/4.examples/4.advanced/jsx",{"title":867,"path":868,"stem":869,"titleTemplate":6},"Locale","/docs/examples/advanced/locale","docs/4.examples/4.advanced/locale",{"title":871,"path":872,"stem":873,"titleTemplate":6},"Module Extend Pages","/docs/examples/advanced/module-extend-pages","docs/4.examples/4.advanced/module-extend-pages",{"title":875,"path":876,"stem":877,"titleTemplate":6},"Teleport","/docs/examples/advanced/teleport","docs/4.examples/4.advanced/teleport",{"title":99,"path":879,"stem":880,"titleTemplate":6},"/docs/examples/advanced/testing","docs/4.examples/4.advanced/testing",{"title":436,"path":882,"stem":883,"titleTemplate":6},"/docs/examples/advanced/use-cookie","docs/4.examples/4.advanced/use-cookie",{"title":885,"path":886,"stem":887,"titleTemplate":6},"Use Custom Fetch Composable","/docs/examples/advanced/use-custom-fetch-composable","docs/4.examples/4.advanced/use-custom-fetch-composable",{"title":889,"path":890,"stem":891,"children":892,"page":108},"Experimental","/docs/examples/experimental","docs/4.examples/7.experimental",[893],{"title":894,"path":895,"stem":896,"titleTemplate":6},"WASM","/docs/examples/experimental/wasm","docs/4.examples/7.experimental/wasm",{"title":898,"titleTemplate":899,"icon":900,"path":901,"stem":902,"children":903,"page":108},"Community","%s · Nuxt Community","i-lucide-messages-square","/docs/community","docs/5.community",[904,909,914,919,924,929],{"title":905,"path":906,"stem":907,"titleTemplate":6,"icon":908},"Getting Help","/docs/community/getting-help","docs/5.community/2.getting-help","i-lucide-life-buoy",{"title":910,"path":911,"stem":912,"titleTemplate":6,"icon":913},"Reporting Bugs","/docs/community/reporting-bugs","docs/5.community/3.reporting-bugs","i-lucide-bug",{"title":915,"path":916,"stem":917,"titleTemplate":6,"icon":918},"Contribution","/docs/community/contribution","docs/5.community/4.contribution","i-lucide-git-pull-request",{"title":920,"path":921,"stem":922,"titleTemplate":6,"icon":923},"Framework","/docs/community/framework-contribution","docs/5.community/5.framework-contribution","i-lucide-github",{"title":925,"path":926,"stem":927,"titleTemplate":6,"icon":928},"Roadmap","/docs/community/roadmap","docs/5.community/6.roadmap","i-lucide-map",{"title":930,"path":931,"stem":932,"titleTemplate":6,"icon":933},"Releases","/docs/community/changelog","docs/5.community/7.changelog","i-lucide-bell-dot",{"title":935,"titleTemplate":936,"icon":937,"path":938,"stem":939,"children":940,"page":108},"Migrate to Nuxt Bridge","Migrate to Nuxt Bridge: %s","i-lucide-ship","/docs/bridge","docs/6.bridge",[941,945,948,951,955,959,963,966,969,972],{"title":942,"path":943,"stem":944,"titleTemplate":6},"Overview","/docs/bridge/overview","docs/6.bridge/1.overview",{"title":29,"path":946,"stem":947,"titleTemplate":6},"/docs/bridge/configuration","docs/6.bridge/10.configuration",{"title":151,"path":949,"stem":950,"titleTemplate":6},"/docs/bridge/typescript","docs/6.bridge/2.typescript",{"title":952,"path":953,"stem":954,"titleTemplate":6},"Legacy Composition API","/docs/bridge/bridge-composition-api","docs/6.bridge/3.bridge-composition-api",{"title":956,"path":957,"stem":958,"titleTemplate":6},"Plugins and Middleware","/docs/bridge/plugins-and-middleware","docs/6.bridge/4.plugins-and-middleware",{"title":960,"path":961,"stem":962,"titleTemplate":6},"New Composition API","/docs/bridge/nuxt3-compatible-api","docs/6.bridge/5.nuxt3-compatible-api",{"title":830,"path":964,"stem":965,"titleTemplate":6},"/docs/bridge/meta","docs/6.bridge/6.meta",{"title":291,"path":967,"stem":968,"titleTemplate":6},"/docs/bridge/runtime-config","docs/6.bridge/7.runtime-config",{"title":738,"path":970,"stem":971,"titleTemplate":6},"/docs/bridge/nitro","docs/6.bridge/8.nitro",{"title":973,"path":974,"stem":975,"titleTemplate":6},"Vite","/docs/bridge/vite","docs/6.bridge/9.vite",{"title":977,"titleTemplate":978,"icon":107,"path":979,"stem":980,"children":981,"page":108},"Migrate to Nuxt 3","Migrate to Nuxt 3: %s","/docs/migration","docs/7.migration",[982,985,989,992,995,998,1001,1004,1007,1011,1015],{"title":942,"path":983,"stem":984,"titleTemplate":6},"/docs/migration/overview","docs/7.migration/1.overview",{"title":986,"path":987,"stem":988,"titleTemplate":6},"Build Tooling","/docs/migration/bundling","docs/7.migration/10.bundling",{"title":79,"path":990,"stem":991,"titleTemplate":6},"/docs/migration/server","docs/7.migration/11.server",{"title":29,"path":993,"stem":994,"titleTemplate":6},"/docs/migration/configuration","docs/7.migration/2.configuration",{"title":143,"path":996,"stem":997,"titleTemplate":6},"/docs/migration/module-authors","docs/7.migration/20.module-authors",{"title":820,"path":999,"stem":1000,"titleTemplate":6},"/docs/migration/auto-imports","docs/7.migration/3.auto-imports",{"title":830,"path":1002,"stem":1003,"titleTemplate":6},"/docs/migration/meta","docs/7.migration/4.meta",{"title":956,"path":1005,"stem":1006,"titleTemplate":6},"/docs/migration/plugins-and-middleware","docs/7.migration/5.plugins-and-middleware",{"title":1008,"path":1009,"stem":1010,"titleTemplate":6},"Pages and Layouts","/docs/migration/pages-and-layouts","docs/7.migration/6.pages-and-layouts",{"title":1012,"path":1013,"stem":1014,"titleTemplate":6},"Component Options","/docs/migration/component-options","docs/7.migration/7.component-options",{"title":291,"path":1016,"stem":1017,"titleTemplate":6},"/docs/migration/runtime-config","docs/7.migration/8.runtime-config",{"title":1019,"path":1020,"stem":1021,"children":1022,"page":108},"Blog","/blog","blog",[1023,1027,1031,1035,1039,1043,1047,1051,1055,1059,1063,1067,1071,1075,1079,1083,1087,1091,1095,1099,1103],{"title":1024,"path":1025,"stem":1026},"Announcing 3.0","/blog/v3","blog/1.v3",{"title":1028,"path":1029,"stem":1030},"Nuxt 3.3","/blog/v3-3","blog/10.v3-3",{"title":1032,"path":1033,"stem":1034},"Nuxt 3.4","/blog/v3-4","blog/11.v3-4",{"title":1036,"path":1037,"stem":1038},"Nuxt 3.5","/blog/v3-5","blog/12.v3-5",{"title":1040,"path":1041,"stem":1042},"Nuxt 3.6","/blog/v3-6","blog/13.v3-6",{"title":1044,"path":1045,"stem":1046},"Nuxt on the Edge","/blog/nuxt-on-the-edge","blog/14.nuxt-on-the-edge",{"title":1048,"path":1049,"stem":1050},"Nuxt DevTools v1.0","/blog/nuxt-devtools-v1-0","blog/18.nuxt-devtools-v1-0",{"title":1052,"path":1053,"stem":1054},"Nuxt: A vision for 2023","/blog/vision-2023","blog/2.vision-2023",{"title":1056,"path":1057,"stem":1058},"The Evolution of Shiki v1.0","/blog/shiki-v1","blog/21.shiki-v1",{"title":1060,"path":1061,"stem":1062},"Refreshed Nuxt ESLint Integrations","/blog/eslint-module","blog/24.eslint-module",{"title":1064,"path":1065,"stem":1066},"Introducing Nuxt Scripts","/blog/nuxt-scripts","blog/26.nuxt-scripts",{"title":1068,"path":1069,"stem":1070},"Introducing Nuxt Icon v1","/blog/nuxt-icon-v1-0","blog/29.nuxt-icon-v1-0",{"title":1072,"path":1073,"stem":1074},"Introducing Nuxt DevTools","/blog/introducing-nuxt-devtools","blog/3.introducing-nuxt-devtools",{"title":1076,"path":1077,"stem":1078},"Announcing Nuxt 3 Release Candidate","/blog/nuxt3-rc","blog/3.nuxt3-rc",{"title":1080,"path":1081,"stem":1082},"Nuxt 2 End-of-Life (EOL)","/blog/nuxt2-eol","blog/4.nuxt2-eol",{"title":1084,"path":1085,"stem":1086},"Introducing Nuxt 3 Beta","/blog/nuxt3-beta","blog/4.nuxt3-beta",{"title":1088,"path":1089,"stem":1090},"Going Full Static","/blog/going-full-static","blog/5.going-full-static",{"title":1092,"path":1093,"stem":1094},"Introducing Smart Prefetching","/blog/introducing-smart-prefetching","blog/6.introducing-smart-prefetching",{"title":1096,"path":1097,"stem":1098},"Understanding how fetch works in Nuxt 2.12","/blog/understanding-how-fetch-works-in-nuxt-2-12","blog/7.understanding-how-fetch-works-in-nuxt-2-12",{"title":1100,"path":1101,"stem":1102},"Nuxt 2 Static Improvements","/blog/nuxt-static-improvements","blog/8.nuxt-static-improvements",{"title":1104,"path":1105,"stem":1106},"Nuxt 2: From Terminal to Browser","/blog/nuxtjs-from-terminal-to-browser","blog/9.nuxtjs-from-terminal-to-browser",{"id":1108,"title":1064,"authors":1109,"body":1116,"category":3231,"date":3232,"description":3233,"draft":108,"extension":3234,"image":1151,"meta":3235,"navigation":2110,"path":1065,"seo":3236,"stem":1066,"tags":6,"__hash__":3237},"blog/blog/26.nuxt-scripts.md",[1110],{"name":1111,"avatar":1112,"to":1114,"twitter":1115},"Harlan Wilton",{"src":1113},"https://github.com/harlan-zw.png","https://github.com/harlan-zw","harlan_zw",{"type":1117,"value":1118,"toc":3212},"minimal",[1119,1137,1140,1152,1157,1166,1175,1189,1192,1196,1209,1218,1221,1224,1229,1241,1246,1322,1325,1328,1341,1863,1867,1870,1886,1907,1920,1929,1938,1941,1944,1951,1955,1959,1969,1975,2002,2005,2013,2292,2296,2304,2311,2318,2327,2390,2394,2419,2428,2431,2864,2868,2881,2884,2902,3031,3035,3038,3052,3055,3094,3101,3105,3108,3115,3118,3148,3151,3155,3164,3168,3198,3201,3208],[1120,1121,1122,1123,1130,1131,1136],"p",{},"The Nuxt team, in collaboration with the ",[1124,1125,1129],"a",{"href":1126,"rel":1127},"https://developer.chrome.com/aurora",[1128],"nofollow","Chrome Aurora"," team at Google, is excited to announce the public beta release of ",[1124,1132,1135],{"href":1133,"rel":1134},"https://scripts.nuxt.com",[1128],"Nuxt Scripts",".",[1120,1138,1139],{},"Nuxt Scripts is a better way to work with third-party scripts, providing improved performance, privacy, security, and developer experience.",[1120,1141,1142],{},[1143,1144],"img",{"alt":1145,"className":1146,"src":1151},"Nuxt Scripts Banner",[1147,1148,1149,1150],"border","border-gray-200","dark:border-gray-700","rounded-lg","/assets/blog/nuxt-scripts/banner.png",[1153,1154,1156],"h2",{"id":1155},"getting-to-nuxt-scripts","Getting to Nuxt Scripts",[1120,1158,1159,1160,1165],{},"Over a year ago, Daniel published the initial ",[1124,1161,1164],{"href":1162,"rel":1163},"https://github.com/nuxt/nuxt/discussions/22016",[1128],"Nuxt Scripts RFC",". The RFC proposed a module that would \"allow third-party scripts to be managed and optimized, following best practices for performant and compliant websites\".",[1120,1167,1168,1169,1174],{},"Having ",[1124,1170,1173],{"href":1171,"rel":1172},"https://github.com/harlan-zw/nuxt-delay-hydration",[1128],"personal experience"," with solving performance issues related to third-party scripts, I knew how difficult these performance optimizations could be. Nonetheless, I was keen to tackle the problem and took over the project.",[1120,1176,1177,1178,1183,1184,1136],{},"With the RFC as the seed of the idea, I started prototyping what it could ",[1124,1179,1182],{"href":1180,"rel":1181},"https://github.com/nuxt/nuxt/discussions/22016#discussioncomment-6527001",[1128],"look like"," using ",[1124,1185,1188],{"href":1186,"rel":1187},"https://unhead.unjs.io/",[1128],"Unhead",[1120,1190,1191],{},"Thinking about what I wanted to build exactly, I found that the real issue wasn't just how to load \"optimized\" third-party scripts but how to make working with third-party scripts a better experience overall.",[1153,1193,1195],{"id":1194},"why-build-a-third-party-script-module","Why Build a Third-Party Script Module?",[1120,1197,1198,1203,1204,1136],{},[1124,1199,1202],{"href":1200,"rel":1201},"https://almanac.httparchive.org/en/2022/third-parties#prevalence",[1128],"94% of sites use at least one third-party provider",", with the average site having ",[1124,1205,1208],{"href":1206,"rel":1207},"https://docs.google.com/spreadsheets/d/1YqoRRsyiNsrEabVLu2nRU98JIG_0zLLuoQhC2nX8xbM/edit?gid=1428106498#gid=1428106498",[1128],"five third-party providers",[1120,1210,1211,1212,1217],{},"We know that third-party scripts aren't perfect; they ",[1124,1213,1216],{"href":1214,"rel":1215},"https://web.dev/articles/optimizing-content-efficiency-loading-third-party-javascript#",[1128],"slow down the web",", cause privacy and security issues, and are a pain to work with.",[1120,1219,1220],{},"However, they are fundamentally useful and aren't going anywhere soon.",[1120,1222,1223],{},"By exploring the issues with third-party scripts, we can see where improvements can be made.",[1225,1226,1228],"h3",{"id":1227},"developer-experience-a-full-stack-headache","😒 Developer Experience: A Full-Stack Headache",[1120,1230,1231,1232,1236,1237,1240],{},"Let's walk through adding a third-party script to your Nuxt app using a fictional ",[1233,1234,1235],"code",{},"tracker.js"," script that adds a ",[1233,1238,1239],{},"track"," function to the window.",[1120,1242,1243,1244,1136],{},"We start by loading the script using ",[1233,1245,448],{},[1247,1248,1253],"pre",{"className":1249,"code":1250,"language":1251,"meta":1252,"style":1252},"language-ts shiki shiki-themes material-theme-lighter material-theme-lighter material-theme-palenight","useHead({ script: [{ src: '/tracker.js', defer: true }] })\n","ts","",[1233,1254,1255],{"__ignoreMap":1252},[1256,1257,1260,1263,1267,1271,1275,1278,1281,1283,1286,1288,1291,1295,1298,1301,1304,1306,1310,1313,1316,1319],"span",{"class":1258,"line":1259},"line",1,[1256,1261,448],{"class":1262},"szd4z",[1256,1264,1266],{"class":1265},"spdxX","(",[1256,1268,1270],{"class":1269},"sYp4K","{",[1256,1272,1274],{"class":1273},"sQ5dg"," script",[1256,1276,1277],{"class":1269},":",[1256,1279,1280],{"class":1265}," [",[1256,1282,1270],{"class":1269},[1256,1284,1285],{"class":1273}," src",[1256,1287,1277],{"class":1269},[1256,1289,1290],{"class":1269}," '",[1256,1292,1294],{"class":1293},"s5UST","/tracker.js",[1256,1296,1297],{"class":1269},"'",[1256,1299,1300],{"class":1269},",",[1256,1302,1303],{"class":1273}," defer",[1256,1305,1277],{"class":1269},[1256,1307,1309],{"class":1308},"sagxc"," true",[1256,1311,1312],{"class":1269}," }",[1256,1314,1315],{"class":1265},"] ",[1256,1317,1318],{"class":1269},"}",[1256,1320,1321],{"class":1265},")\n",[1120,1323,1324],{},"However, let's now try to get the script functionality working in our app.",[1120,1326,1327],{},"The following steps are common when working with third-party scripts in Nuxt:",[1329,1330,1331,1335,1338],"ul",{},[1332,1333,1334],"li",{},"Everything has to be wrapped for SSR safety.",[1332,1336,1337],{},"Flaky checks for if the script has loaded.",[1332,1339,1340],{},"Augmenting the window object for types.",[1342,1343,1344,1428,1529,1669],"code-group",{},[1247,1345,1350],{"className":1346,"code":1347,"filename":1348,"language":1349,"meta":1252,"style":1252},"language-vue shiki shiki-themes material-theme-lighter material-theme-lighter material-theme-palenight","\u003Cscript setup>\n// ❌ Oops, window is not defined! \n// 💡 The window can't be directly accessed if we use SSR in Nuxt.\n// 👉 We need to make this SSR safe\nwindow.track('page_view', useRoute().path)\n\u003C/script>\n","1: SSR Safety","vue",[1233,1351,1352,1367,1374,1380,1386,1418],{"__ignoreMap":1252},[1256,1353,1354,1357,1360,1364],{"class":1258,"line":1259},[1256,1355,1356],{"class":1269},"\u003C",[1256,1358,1359],{"class":1273},"script",[1256,1361,1363],{"class":1362},"sRBFq"," setup",[1256,1365,1366],{"class":1269},">\n",[1256,1368,1370],{"class":1258,"line":1369},2,[1256,1371,1373],{"class":1372},"svXlt","// ❌ Oops, window is not defined! \n",[1256,1375,1377],{"class":1258,"line":1376},3,[1256,1378,1379],{"class":1372},"// 💡 The window can't be directly accessed if we use SSR in Nuxt.\n",[1256,1381,1383],{"class":1258,"line":1382},4,[1256,1384,1385],{"class":1372},"// 👉 We need to make this SSR safe\n",[1256,1387,1389,1392,1394,1396,1398,1400,1403,1405,1407,1410,1413,1415],{"class":1258,"line":1388},5,[1256,1390,1391],{"class":1265},"window",[1256,1393,1136],{"class":1269},[1256,1395,1239],{"class":1262},[1256,1397,1266],{"class":1265},[1256,1399,1297],{"class":1269},[1256,1401,1402],{"class":1293},"page_view",[1256,1404,1297],{"class":1269},[1256,1406,1300],{"class":1269},[1256,1408,1409],{"class":1262}," useRoute",[1256,1411,1412],{"class":1265},"()",[1256,1414,1136],{"class":1269},[1256,1416,1417],{"class":1265},"path)\n",[1256,1419,1421,1424,1426],{"class":1258,"line":1420},6,[1256,1422,1423],{"class":1269},"\u003C/",[1256,1425,1359],{"class":1273},[1256,1427,1366],{"class":1269},[1247,1429,1432],{"className":1346,"code":1430,"filename":1431,"language":1349,"meta":1252,"style":1252},"\u003Cscript setup>\nif (import.meta.client) {\n  // ❌ Oops, the script hasn't finished loading yet!\n  // 💡 A `defer` script may not be available while our Nuxt app hydrates.\n  // 👉 We need to wait for the script to be loaded\n  window.track('page_view', useRoute().path)\n}\n\u003C/script>\n","2: Script Timing",[1233,1433,1434,1444,1469,1474,1479,1484,1514,1520],{"__ignoreMap":1252},[1256,1435,1436,1438,1440,1442],{"class":1258,"line":1259},[1256,1437,1356],{"class":1269},[1256,1439,1359],{"class":1273},[1256,1441,1363],{"class":1362},[1256,1443,1366],{"class":1269},[1256,1445,1446,1450,1453,1456,1458,1461,1463,1466],{"class":1258,"line":1369},[1256,1447,1449],{"class":1448},"sFVN2","if",[1256,1451,1452],{"class":1265}," (",[1256,1454,1455],{"class":1448},"import",[1256,1457,1136],{"class":1269},[1256,1459,1460],{"class":1265},"meta",[1256,1462,1136],{"class":1269},[1256,1464,1465],{"class":1265},"client) ",[1256,1467,1468],{"class":1269},"{\n",[1256,1470,1471],{"class":1258,"line":1376},[1256,1472,1473],{"class":1372},"  // ❌ Oops, the script hasn't finished loading yet!\n",[1256,1475,1476],{"class":1258,"line":1382},[1256,1477,1478],{"class":1372},"  // 💡 A `defer` script may not be available while our Nuxt app hydrates.\n",[1256,1480,1481],{"class":1258,"line":1388},[1256,1482,1483],{"class":1372},"  // 👉 We need to wait for the script to be loaded\n",[1256,1485,1486,1489,1491,1493,1495,1497,1499,1501,1503,1505,1507,1509,1512],{"class":1258,"line":1420},[1256,1487,1488],{"class":1265},"  window",[1256,1490,1136],{"class":1269},[1256,1492,1239],{"class":1262},[1256,1494,1266],{"class":1273},[1256,1496,1297],{"class":1269},[1256,1498,1402],{"class":1293},[1256,1500,1297],{"class":1269},[1256,1502,1300],{"class":1269},[1256,1504,1409],{"class":1262},[1256,1506,1412],{"class":1273},[1256,1508,1136],{"class":1269},[1256,1510,1511],{"class":1265},"path",[1256,1513,1321],{"class":1273},[1256,1515,1517],{"class":1258,"line":1516},7,[1256,1518,1519],{"class":1269},"}\n",[1256,1521,1523,1525,1527],{"class":1258,"line":1522},8,[1256,1524,1423],{"class":1269},[1256,1526,1359],{"class":1273},[1256,1528,1366],{"class":1269},[1247,1530,1533],{"className":1346,"code":1531,"filename":1532,"language":1349,"meta":1252,"style":1252},"\u003Cscript lang=\"ts\" setup>\nif (import.meta.client) {\n  useTimeoutFn(() => {\n    // ✅ It's working!\n    // ❌ Oops, types are broken.\n    // 💡 The `window` has strict types and nothing is defined yet.\n    // 👉 We need to manually augment the window\n    window.track('page_view', useRoute().path)\n  }, 1000 /* should be loaded in 1 second!? */)\n}\n\u003C/script>\n","3: Broken types",[1233,1534,1535,1558,1576,1591,1596,1601,1606,1611,1640,1655,1660],{"__ignoreMap":1252},[1256,1536,1537,1539,1541,1544,1547,1550,1552,1554,1556],{"class":1258,"line":1259},[1256,1538,1356],{"class":1269},[1256,1540,1359],{"class":1273},[1256,1542,1543],{"class":1362}," lang",[1256,1545,1546],{"class":1269},"=",[1256,1548,1549],{"class":1269},"\"",[1256,1551,1251],{"class":1293},[1256,1553,1549],{"class":1269},[1256,1555,1363],{"class":1362},[1256,1557,1366],{"class":1269},[1256,1559,1560,1562,1564,1566,1568,1570,1572,1574],{"class":1258,"line":1369},[1256,1561,1449],{"class":1448},[1256,1563,1452],{"class":1265},[1256,1565,1455],{"class":1448},[1256,1567,1136],{"class":1269},[1256,1569,1460],{"class":1265},[1256,1571,1136],{"class":1269},[1256,1573,1465],{"class":1265},[1256,1575,1468],{"class":1269},[1256,1577,1578,1581,1583,1585,1588],{"class":1258,"line":1376},[1256,1579,1580],{"class":1262},"  useTimeoutFn",[1256,1582,1266],{"class":1273},[1256,1584,1412],{"class":1269},[1256,1586,1587],{"class":1362}," =>",[1256,1589,1590],{"class":1269}," {\n",[1256,1592,1593],{"class":1258,"line":1382},[1256,1594,1595],{"class":1372},"    // ✅ It's working!\n",[1256,1597,1598],{"class":1258,"line":1388},[1256,1599,1600],{"class":1372},"    // ❌ Oops, types are broken.\n",[1256,1602,1603],{"class":1258,"line":1420},[1256,1604,1605],{"class":1372},"    // 💡 The `window` has strict types and nothing is defined yet.\n",[1256,1607,1608],{"class":1258,"line":1516},[1256,1609,1610],{"class":1372},"    // 👉 We need to manually augment the window\n",[1256,1612,1613,1616,1618,1620,1622,1624,1626,1628,1630,1632,1634,1636,1638],{"class":1258,"line":1522},[1256,1614,1615],{"class":1265},"    window",[1256,1617,1136],{"class":1269},[1256,1619,1239],{"class":1262},[1256,1621,1266],{"class":1273},[1256,1623,1297],{"class":1269},[1256,1625,1402],{"class":1293},[1256,1627,1297],{"class":1269},[1256,1629,1300],{"class":1269},[1256,1631,1409],{"class":1262},[1256,1633,1412],{"class":1273},[1256,1635,1136],{"class":1269},[1256,1637,1511],{"class":1265},[1256,1639,1321],{"class":1273},[1256,1641,1643,1646,1650,1653],{"class":1258,"line":1642},9,[1256,1644,1645],{"class":1269},"  },",[1256,1647,1649],{"class":1648},"sV9sa"," 1000",[1256,1651,1652],{"class":1372}," /* should be loaded in 1 second!? */",[1256,1654,1321],{"class":1273},[1256,1656,1658],{"class":1258,"line":1657},10,[1256,1659,1519],{"class":1269},[1256,1661,1663,1665,1667],{"class":1258,"line":1662},11,[1256,1664,1423],{"class":1269},[1256,1666,1359],{"class":1273},[1256,1668,1366],{"class":1269},[1247,1670,1673],{"className":1346,"code":1671,"filename":1672,"language":1349,"meta":1252,"style":1252},"\u003Cscript lang=\"ts\" setup>\ndeclare global {\n  interface Window {\n    track: (e: string, p: string) => void\n  }\n}\nif (import.meta.client) {\n  useTimeoutFn(() => {\n    // ✅ It's working and types are valid! \n    // ❌ Oops, ad-blockers, GDPR and duplicate scripts\n    // 💡 There's a lot of hidden complexity in third-party scripts\n    // 👉 We need a better API\n    window.track('page_view', useRoute().path)\n  }, 1000)\n}\n\u003C/script>\n","4: It works?",[1233,1674,1675,1695,1705,1716,1751,1756,1760,1778,1790,1795,1800,1805,1811,1840,1849,1854],{"__ignoreMap":1252},[1256,1676,1677,1679,1681,1683,1685,1687,1689,1691,1693],{"class":1258,"line":1259},[1256,1678,1356],{"class":1269},[1256,1680,1359],{"class":1273},[1256,1682,1543],{"class":1362},[1256,1684,1546],{"class":1269},[1256,1686,1549],{"class":1269},[1256,1688,1251],{"class":1293},[1256,1690,1549],{"class":1269},[1256,1692,1363],{"class":1362},[1256,1694,1366],{"class":1269},[1256,1696,1697,1700,1703],{"class":1258,"line":1369},[1256,1698,1699],{"class":1362},"declare",[1256,1701,1702],{"class":1265}," global ",[1256,1704,1468],{"class":1269},[1256,1706,1707,1710,1714],{"class":1258,"line":1376},[1256,1708,1709],{"class":1362},"  interface",[1256,1711,1713],{"class":1712},"sT2Ow"," Window",[1256,1715,1590],{"class":1269},[1256,1717,1718,1721,1723,1725,1729,1731,1734,1736,1739,1741,1743,1746,1748],{"class":1258,"line":1382},[1256,1719,1720],{"class":1273},"    track",[1256,1722,1277],{"class":1269},[1256,1724,1452],{"class":1269},[1256,1726,1728],{"class":1727},"ssYd4","e",[1256,1730,1277],{"class":1269},[1256,1732,1733],{"class":1712}," string",[1256,1735,1300],{"class":1269},[1256,1737,1738],{"class":1727}," p",[1256,1740,1277],{"class":1269},[1256,1742,1733],{"class":1712},[1256,1744,1745],{"class":1269},")",[1256,1747,1587],{"class":1362},[1256,1749,1750],{"class":1712}," void\n",[1256,1752,1753],{"class":1258,"line":1388},[1256,1754,1755],{"class":1269},"  }\n",[1256,1757,1758],{"class":1258,"line":1420},[1256,1759,1519],{"class":1269},[1256,1761,1762,1764,1766,1768,1770,1772,1774,1776],{"class":1258,"line":1516},[1256,1763,1449],{"class":1448},[1256,1765,1452],{"class":1265},[1256,1767,1455],{"class":1448},[1256,1769,1136],{"class":1269},[1256,1771,1460],{"class":1265},[1256,1773,1136],{"class":1269},[1256,1775,1465],{"class":1265},[1256,1777,1468],{"class":1269},[1256,1779,1780,1782,1784,1786,1788],{"class":1258,"line":1522},[1256,1781,1580],{"class":1262},[1256,1783,1266],{"class":1273},[1256,1785,1412],{"class":1269},[1256,1787,1587],{"class":1362},[1256,1789,1590],{"class":1269},[1256,1791,1792],{"class":1258,"line":1642},[1256,1793,1794],{"class":1372},"    // ✅ It's working and types are valid! \n",[1256,1796,1797],{"class":1258,"line":1657},[1256,1798,1799],{"class":1372},"    // ❌ Oops, ad-blockers, GDPR and duplicate scripts\n",[1256,1801,1802],{"class":1258,"line":1662},[1256,1803,1804],{"class":1372},"    // 💡 There's a lot of hidden complexity in third-party scripts\n",[1256,1806,1808],{"class":1258,"line":1807},12,[1256,1809,1810],{"class":1372},"    // 👉 We need a better API\n",[1256,1812,1814,1816,1818,1820,1822,1824,1826,1828,1830,1832,1834,1836,1838],{"class":1258,"line":1813},13,[1256,1815,1615],{"class":1265},[1256,1817,1136],{"class":1269},[1256,1819,1239],{"class":1262},[1256,1821,1266],{"class":1273},[1256,1823,1297],{"class":1269},[1256,1825,1402],{"class":1293},[1256,1827,1297],{"class":1269},[1256,1829,1300],{"class":1269},[1256,1831,1409],{"class":1262},[1256,1833,1412],{"class":1273},[1256,1835,1136],{"class":1269},[1256,1837,1511],{"class":1265},[1256,1839,1321],{"class":1273},[1256,1841,1843,1845,1847],{"class":1258,"line":1842},14,[1256,1844,1645],{"class":1269},[1256,1846,1649],{"class":1648},[1256,1848,1321],{"class":1273},[1256,1850,1852],{"class":1258,"line":1851},15,[1256,1853,1519],{"class":1269},[1256,1855,1857,1859,1861],{"class":1258,"line":1856},16,[1256,1858,1423],{"class":1269},[1256,1860,1359],{"class":1273},[1256,1862,1366],{"class":1269},[1225,1864,1866],{"id":1865},"performance-why-cant-i-get-100-on-lighthouse","🐌 Performance: \"Why can't I get 100 on Lighthouse?\"",[1120,1868,1869],{},"For a visitor to start interacting with your Nuxt site, the app bundle needs to be downloaded and Vue needs to hydrate the app instance.",[1120,1871,1872,1873,1876,1877,1880,1881,1136],{},"Loading third-party scripts can interfere with this hydration process, even when using ",[1233,1874,1875],{},"async"," or ",[1233,1878,1879],{},"defer",". This slows down the network and blocks the main thread, leading to a degraded user experience and poor ",[1124,1882,1885],{"href":1883,"rel":1884},"https://web.dev/vitals/",[1128],"Core Web Vitals",[1120,1887,1888,1889,1894,1895,1900,1901,1906],{},"The ",[1124,1890,1893],{"href":1891,"rel":1892},"https://developer.chrome.com/docs/crux",[1128],"Chrome User Experience Report"," shows Nuxt sites with numerous third-party resources typically have poorer ",[1124,1896,1899],{"href":1897,"rel":1898},"https://web.dev/articles/inp",[1128],"Interaction to Next Paint (INP)"," and ",[1124,1902,1905],{"href":1903,"rel":1904},"https://web.dev/articles/lcp",[1128],"Largest Contentful Paint (LCP)"," scores.",[1120,1908,1909,1910,1915,1916,1136],{},"To see how third-party scripts degrade performance, we can look at the ",[1124,1911,1914],{"href":1912,"rel":1913},"https://almanac.httparchive.org/en/2022/third-parties#impact-on-performance",[1128],"Web Almanac 2022",". The report shows that the top 10 third-party scripts ",[1917,1918,1919],"strong",{},"average median blocking time is 1.4 seconds",[1225,1921,1923,1924,1928],{"id":1922},"️-privacy-security-do-no-evil","🛡️ Privacy & Security: Do ",[1925,1926,1927],"em",{},"no"," evil?",[1120,1930,1931,1932,1937],{},"Of the top 10,000 sites, 58% of them have third-party scripts that ",[1124,1933,1936],{"href":1934,"rel":1935},"https://www3.cs.stonybrook.edu/~mikepo/papers/firstparty.www21.pdf",[1128],"exchange tracking IDs stored in external cookies",", meaning they can track users across sites even with third-party cookies disabled.",[1120,1939,1940],{},"While in many cases our hands are tied with the providers we use, we should try to minimize the amount of our end-users' data that we're leaking where possible.",[1120,1942,1943],{},"When we do take on the privacy implications, it can then be difficult to accurately convey these in our privacy policies and build the consent management required to comply with regulations such as GDPR.",[1120,1945,1946,1947,1950],{},"Security when using third-party scripts is also a concern. Third-party scripts are common attack vectors for malicious actors, most do not provide ",[1233,1948,1949],{},"integrity"," hashes for their scripts, meaning they can be compromised and inject malicious code into your app at any time.",[1153,1952,1954],{"id":1953},"what-does-nuxt-scripts-do-about-these-issues","What does Nuxt Scripts do about these issues?",[1225,1956,1958],{"id":1957},"composable-usescript","Composable: useScript",[1120,1960,1961,1962,1965,1966,1136],{},"This composable sits between the ",[1233,1963,1964],{},"\u003Cscript>"," tag and the functionality added to ",[1233,1967,1968],{},"window.{thirdPartyKey}",[1120,1970,1971,1972,1974],{},"For the ",[1233,1973,1964],{}," tag, the composable:",[1329,1976,1977,1980,1983,1993],{},[1332,1978,1979],{},"Gives full visibility into the script's loading and error states",[1332,1981,1982],{},"Loads scripts as Nuxt is hydrating the app by default, for slightly better performance.",[1332,1984,1985,1986,1900,1989,1992],{},"Restricts ",[1233,1987,1988],{},"crossorigin",[1233,1990,1991],{},"referrerpolicy"," to improve privacy and security.",[1332,1994,1995,1996,2001],{},"Provides a way to ",[1124,1997,2000],{"href":1998,"rel":1999},"https://scripts.nuxt.com/docs/guides/script-triggers",[1128],"delay loading the script"," until you need it.",[1120,2003,2004],{},"For the scripts API, it:",[1329,2006,2007,2010],{},[1332,2008,2009],{},"Provides full type-safety around the script's functions",[1332,2011,2012],{},"Adds a proxy layer allowing your app to run when the script functions in unsafe contexts (SSR, before the script is loaded, the script is blocked)",[1342,2014,2015,2235],{},[1247,2016,2019],{"className":1249,"code":2017,"filename":2018,"language":1251,"meta":1252,"style":1252},"const { proxy, onLoaded } = useScript('/hello.js', {\n  trigger: 'onNuxtReady',\n  use() {\n    return window.helloWorld\n  }\n})\n\nonLoaded(({ greeting }) => {\n  // ✅ script is loaded! Hooks into Vue lifecycle\n})\n\n// ✅ OR use the proxy API - SSR friendly, called when script is loaded\nproxy.greeting() // Hello, World!\n\ndeclare global {\n  interface Window {\n    helloWorld: {\n      greeting: () => 'Hello World!'\n    }\n  }\n}\n","hello.ts",[1233,2020,2021,2058,2074,2083,2096,2100,2106,2112,2132,2137,2143,2147,2152,2168,2172,2180,2188,2198,2219,2225,2230],{"__ignoreMap":1252},[1256,2022,2023,2026,2029,2032,2034,2037,2039,2042,2045,2047,2049,2052,2054,2056],{"class":1258,"line":1259},[1256,2024,2025],{"class":1362},"const",[1256,2027,2028],{"class":1269}," {",[1256,2030,2031],{"class":1265}," proxy",[1256,2033,1300],{"class":1269},[1256,2035,2036],{"class":1265}," onLoaded ",[1256,2038,1318],{"class":1269},[1256,2040,2041],{"class":1269}," =",[1256,2043,2044],{"class":1262}," useScript",[1256,2046,1266],{"class":1265},[1256,2048,1297],{"class":1269},[1256,2050,2051],{"class":1293},"/hello.js",[1256,2053,1297],{"class":1269},[1256,2055,1300],{"class":1269},[1256,2057,1590],{"class":1269},[1256,2059,2060,2063,2065,2067,2069,2071],{"class":1258,"line":1369},[1256,2061,2062],{"class":1273},"  trigger",[1256,2064,1277],{"class":1269},[1256,2066,1290],{"class":1269},[1256,2068,607],{"class":1293},[1256,2070,1297],{"class":1269},[1256,2072,2073],{"class":1269},",\n",[1256,2075,2076,2079,2081],{"class":1258,"line":1376},[1256,2077,2078],{"class":1273},"  use",[1256,2080,1412],{"class":1269},[1256,2082,1590],{"class":1269},[1256,2084,2085,2088,2091,2093],{"class":1258,"line":1382},[1256,2086,2087],{"class":1448},"    return",[1256,2089,2090],{"class":1265}," window",[1256,2092,1136],{"class":1269},[1256,2094,2095],{"class":1265},"helloWorld\n",[1256,2097,2098],{"class":1258,"line":1388},[1256,2099,1755],{"class":1269},[1256,2101,2102,2104],{"class":1258,"line":1420},[1256,2103,1318],{"class":1269},[1256,2105,1321],{"class":1265},[1256,2107,2108],{"class":1258,"line":1516},[1256,2109,2111],{"emptyLinePlaceholder":2110},true,"\n",[1256,2113,2114,2117,2119,2122,2125,2128,2130],{"class":1258,"line":1522},[1256,2115,2116],{"class":1262},"onLoaded",[1256,2118,1266],{"class":1265},[1256,2120,2121],{"class":1269},"({",[1256,2123,2124],{"class":1727}," greeting",[1256,2126,2127],{"class":1269}," })",[1256,2129,1587],{"class":1362},[1256,2131,1590],{"class":1269},[1256,2133,2134],{"class":1258,"line":1642},[1256,2135,2136],{"class":1372},"  // ✅ script is loaded! Hooks into Vue lifecycle\n",[1256,2138,2139,2141],{"class":1258,"line":1657},[1256,2140,1318],{"class":1269},[1256,2142,1321],{"class":1265},[1256,2144,2145],{"class":1258,"line":1662},[1256,2146,2111],{"emptyLinePlaceholder":2110},[1256,2148,2149],{"class":1258,"line":1807},[1256,2150,2151],{"class":1372},"// ✅ OR use the proxy API - SSR friendly, called when script is loaded\n",[1256,2153,2154,2157,2159,2162,2165],{"class":1258,"line":1813},[1256,2155,2156],{"class":1265},"proxy",[1256,2158,1136],{"class":1269},[1256,2160,2161],{"class":1262},"greeting",[1256,2163,2164],{"class":1265},"() ",[1256,2166,2167],{"class":1372},"// Hello, World!\n",[1256,2169,2170],{"class":1258,"line":1842},[1256,2171,2111],{"emptyLinePlaceholder":2110},[1256,2173,2174,2176,2178],{"class":1258,"line":1851},[1256,2175,1699],{"class":1362},[1256,2177,1702],{"class":1265},[1256,2179,1468],{"class":1269},[1256,2181,2182,2184,2186],{"class":1258,"line":1856},[1256,2183,1709],{"class":1362},[1256,2185,1713],{"class":1712},[1256,2187,1590],{"class":1269},[1256,2189,2191,2194,2196],{"class":1258,"line":2190},17,[1256,2192,2193],{"class":1273},"    helloWorld",[1256,2195,1277],{"class":1269},[1256,2197,1590],{"class":1269},[1256,2199,2201,2204,2206,2209,2211,2213,2216],{"class":1258,"line":2200},18,[1256,2202,2203],{"class":1273},"      greeting",[1256,2205,1277],{"class":1269},[1256,2207,2208],{"class":1269}," ()",[1256,2210,1587],{"class":1362},[1256,2212,1290],{"class":1269},[1256,2214,2215],{"class":1293},"Hello World!",[1256,2217,2218],{"class":1269},"'\n",[1256,2220,2222],{"class":1258,"line":2221},19,[1256,2223,2224],{"class":1269},"    }\n",[1256,2226,2228],{"class":1258,"line":2227},20,[1256,2229,1755],{"class":1269},[1256,2231,2233],{"class":1258,"line":2232},21,[1256,2234,1519],{"class":1269},[1247,2236,2239],{"className":1249,"code":2237,"filename":2238,"language":1251,"meta":1252,"style":1252},"window.helloWorld = {\n  greeting() {\n    console.log('Hello, World!')\n  }\n}\n","hello.js",[1233,2240,2241,2254,2263,2284,2288],{"__ignoreMap":1252},[1256,2242,2243,2245,2247,2250,2252],{"class":1258,"line":1259},[1256,2244,1391],{"class":1265},[1256,2246,1136],{"class":1269},[1256,2248,2249],{"class":1265},"helloWorld ",[1256,2251,1546],{"class":1269},[1256,2253,1590],{"class":1269},[1256,2255,2256,2259,2261],{"class":1258,"line":1369},[1256,2257,2258],{"class":1273},"  greeting",[1256,2260,1412],{"class":1269},[1256,2262,1590],{"class":1269},[1256,2264,2265,2268,2270,2273,2275,2277,2280,2282],{"class":1258,"line":1376},[1256,2266,2267],{"class":1265},"    console",[1256,2269,1136],{"class":1269},[1256,2271,2272],{"class":1262},"log",[1256,2274,1266],{"class":1273},[1256,2276,1297],{"class":1269},[1256,2278,2279],{"class":1293},"Hello, World!",[1256,2281,1297],{"class":1269},[1256,2283,1321],{"class":1273},[1256,2285,2286],{"class":1258,"line":1382},[1256,2287,1755],{"class":1269},[1256,2289,2290],{"class":1258,"line":1388},[1256,2291,1519],{"class":1269},[1225,2293,2295],{"id":2294},"script-registry","Script Registry",[1120,2297,1888,2298,2303],{},[1124,2299,2302],{"href":2300,"rel":2301},"https://scripts.nuxt.com/scripts",[1128],"script registry"," is a collection of first-party integrations for common third-party scripts. As of release, we support 21 scripts, with more to come.",[1120,2305,2306],{},[1143,2307],{"alt":2308,"className":2309,"src":2310},"Nuxt Scripts Registry",[1147,1148,1149,1150],"/assets/blog/nuxt-scripts/registry.png",[1120,2312,2313,2314,2317],{},"These registry scripts are fine-tuned wrappers around ",[1233,2315,2316],{},"useScript"," with full type-safety, runtime validation of the script options (dev only) and environment variable support",[1120,2319,2320,2321,2326],{},"For example, we can look at the ",[1124,2322,2325],{"href":2323,"rel":2324},"https://scripts.nuxt.com/scripts/analytics/fathom-analytics",[1128],"Fathom Analytics"," script.",[1247,2328,2330],{"className":1249,"code":2329,"language":1251,"meta":1252,"style":1252},"const { proxy } = useScriptFathomAnalytics({\n  // ✅ options are validated at runtime\n  site: undefined\n})\n// ✅ typed\nproxy.trackPageview()\n",[1233,2331,2332,2352,2357,2367,2373,2378],{"__ignoreMap":1252},[1256,2333,2334,2336,2338,2341,2343,2345,2348,2350],{"class":1258,"line":1259},[1256,2335,2025],{"class":1362},[1256,2337,2028],{"class":1269},[1256,2339,2340],{"class":1265}," proxy ",[1256,2342,1318],{"class":1269},[1256,2344,2041],{"class":1269},[1256,2346,2347],{"class":1262}," useScriptFathomAnalytics",[1256,2349,1266],{"class":1265},[1256,2351,1468],{"class":1269},[1256,2353,2354],{"class":1258,"line":1369},[1256,2355,2356],{"class":1372},"  // ✅ options are validated at runtime\n",[1256,2358,2359,2362,2364],{"class":1258,"line":1376},[1256,2360,2361],{"class":1273},"  site",[1256,2363,1277],{"class":1269},[1256,2365,2366],{"class":1269}," undefined\n",[1256,2368,2369,2371],{"class":1258,"line":1382},[1256,2370,1318],{"class":1269},[1256,2372,1321],{"class":1265},[1256,2374,2375],{"class":1258,"line":1388},[1256,2376,2377],{"class":1372},"// ✅ typed\n",[1256,2379,2380,2382,2384,2387],{"class":1258,"line":1420},[1256,2381,2156],{"class":1265},[1256,2383,1136],{"class":1269},[1256,2385,2386],{"class":1262},"trackPageview",[1256,2388,2389],{"class":1265},"()\n",[1225,2391,2393],{"id":2392},"facade-components","Facade Components",[1120,2395,2396,2397,2402,2403,2408,2409,1900,2414,1136],{},"The registry includes several ",[1124,2398,2401],{"href":2399,"rel":2400},"https://scripts.nuxt.com/docs/guides/facade-components",[1128],"facade components",", such as\n",[1124,2404,2407],{"href":2405,"rel":2406},"https://scripts.nuxt.com/scripts/content/google-maps",[1128],"Google Maps",", ",[1124,2410,2413],{"href":2411,"rel":2412},"https://scripts.nuxt.com/scripts/content/youtube-player",[1128],"YouTube",[1124,2415,2418],{"href":2416,"rel":2417},"https://scripts.nuxt.com/scripts/support/intercom",[1128],"Intercom",[1120,2420,2421,2422,2427],{},"Facade components are \"fake\" components that get hydrated when the third-party script loads. Facade components\nhave trade-offs but can drastically improve your performance. See the ",[1124,2423,2426],{"href":2424,"rel":2425},"https://scripts.nuxt.com/docs/guides/facade-components#what-are-facade-components",[1128],"What are Facade Components?","\nguide for more information.",[1120,2429,2430],{},"Nuxt Scripts provides facade components as accessible but headless, meaning they are not styled by default but add the necessary\na16y data.",[1342,2432,2433,2437],{},[2434,2435],"youtube-demo",{"label":2436},"Output",[1247,2438,2441],{"className":1346,"code":2439,"filename":2440,"language":1349,"meta":1252,"style":1252},"\u003Cscript setup lang=\"ts\">\nconst isLoaded = ref(false)\nconst isPlaying = ref(false)\nconst video = ref()\nfunction play() {\n  video.value?.player.playVideo()\n}\nfunction stateChange(state) {\n  isPlaying.value = state.data === 1\n}\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CScriptYouTubePlayer ref=\"video\" video-id=\"d_IFKP1Ofq0\" @ready=\"isLoaded = true\" @state-change=\"stateChange\">\n    \u003Ctemplate #awaitingLoad>\n      \u003Cdiv class=\"absolute left-1/2 top-1/2 transform -translate-x-1/2 -translate-y-1/2 h-[48px] w-[68px]\">\n        \u003Csvg height=\"100%\" version=\"1.1\" viewBox=\"0 0 68 48\" width=\"100%\">\u003Cpath d=\"M66.52,7.74c-0.78-2.93-2.49-5.41-5.42-6.19C55.79,.13,34,0,34,0S12.21,.13,6.9,1.55 C3.97,2.33,2.27,4.81,1.48,7.74C0.06,13.05,0,24,0,24s0.06,10.95,1.48,16.26c0.78,2.93,2.49,5.41,5.42,6.19 C12.21,47.87,34,48,34,48s21.79-0.13,27.1-1.55c2.93-0.78,4.64-3.26,5.42-6.19C67.94,34.95,68,24,68,24S67.94,13.05,66.52,7.74z\" fill=\"#f00\" />\u003Cpath d=\"M 45,24 27,14 27,34\" fill=\"#fff\" />\u003C/svg>\n      \u003C/div>\n    \u003C/template>\n  \u003C/ScriptYouTubePlayer>\n\u003C/template>\n","Input",[1233,2442,2443,2463,2482,2499,2512,2524,2547,2551,2567,2592,2596,2604,2608,2617,2674,2689,2711,2829,2838,2847,2856],{"__ignoreMap":1252},[1256,2444,2445,2447,2449,2451,2453,2455,2457,2459,2461],{"class":1258,"line":1259},[1256,2446,1356],{"class":1269},[1256,2448,1359],{"class":1273},[1256,2450,1363],{"class":1362},[1256,2452,1543],{"class":1362},[1256,2454,1546],{"class":1269},[1256,2456,1549],{"class":1269},[1256,2458,1251],{"class":1293},[1256,2460,1549],{"class":1269},[1256,2462,1366],{"class":1269},[1256,2464,2465,2467,2470,2472,2475,2477,2480],{"class":1258,"line":1369},[1256,2466,2025],{"class":1362},[1256,2468,2469],{"class":1265}," isLoaded ",[1256,2471,1546],{"class":1269},[1256,2473,2474],{"class":1262}," ref",[1256,2476,1266],{"class":1265},[1256,2478,2479],{"class":1308},"false",[1256,2481,1321],{"class":1265},[1256,2483,2484,2486,2489,2491,2493,2495,2497],{"class":1258,"line":1376},[1256,2485,2025],{"class":1362},[1256,2487,2488],{"class":1265}," isPlaying ",[1256,2490,1546],{"class":1269},[1256,2492,2474],{"class":1262},[1256,2494,1266],{"class":1265},[1256,2496,2479],{"class":1308},[1256,2498,1321],{"class":1265},[1256,2500,2501,2503,2506,2508,2510],{"class":1258,"line":1382},[1256,2502,2025],{"class":1362},[1256,2504,2505],{"class":1265}," video ",[1256,2507,1546],{"class":1269},[1256,2509,2474],{"class":1262},[1256,2511,2389],{"class":1265},[1256,2513,2514,2517,2520,2522],{"class":1258,"line":1388},[1256,2515,2516],{"class":1362},"function",[1256,2518,2519],{"class":1262}," play",[1256,2521,1412],{"class":1269},[1256,2523,1590],{"class":1269},[1256,2525,2526,2529,2531,2534,2537,2540,2542,2545],{"class":1258,"line":1420},[1256,2527,2528],{"class":1265},"  video",[1256,2530,1136],{"class":1269},[1256,2532,2533],{"class":1265},"value",[1256,2535,2536],{"class":1269},"?.",[1256,2538,2539],{"class":1265},"player",[1256,2541,1136],{"class":1269},[1256,2543,2544],{"class":1262},"playVideo",[1256,2546,2389],{"class":1273},[1256,2548,2549],{"class":1258,"line":1516},[1256,2550,1519],{"class":1269},[1256,2552,2553,2555,2558,2560,2563,2565],{"class":1258,"line":1522},[1256,2554,2516],{"class":1362},[1256,2556,2557],{"class":1262}," stateChange",[1256,2559,1266],{"class":1269},[1256,2561,2562],{"class":1727},"state",[1256,2564,1745],{"class":1269},[1256,2566,1590],{"class":1269},[1256,2568,2569,2572,2574,2576,2578,2581,2583,2586,2589],{"class":1258,"line":1642},[1256,2570,2571],{"class":1265},"  isPlaying",[1256,2573,1136],{"class":1269},[1256,2575,2533],{"class":1265},[1256,2577,2041],{"class":1269},[1256,2579,2580],{"class":1265}," state",[1256,2582,1136],{"class":1269},[1256,2584,2585],{"class":1265},"data",[1256,2587,2588],{"class":1269}," ===",[1256,2590,2591],{"class":1648}," 1\n",[1256,2593,2594],{"class":1258,"line":1657},[1256,2595,1519],{"class":1269},[1256,2597,2598,2600,2602],{"class":1258,"line":1662},[1256,2599,1423],{"class":1269},[1256,2601,1359],{"class":1273},[1256,2603,1366],{"class":1269},[1256,2605,2606],{"class":1258,"line":1807},[1256,2607,2111],{"emptyLinePlaceholder":2110},[1256,2609,2610,2612,2615],{"class":1258,"line":1813},[1256,2611,1356],{"class":1269},[1256,2613,2614],{"class":1273},"template",[1256,2616,1366],{"class":1269},[1256,2618,2619,2622,2625,2627,2629,2631,2634,2636,2639,2641,2643,2646,2648,2651,2653,2655,2658,2660,2663,2665,2667,2670,2672],{"class":1258,"line":1842},[1256,2620,2621],{"class":1269},"  \u003C",[1256,2623,2624],{"class":1273},"ScriptYouTubePlayer",[1256,2626,2474],{"class":1362},[1256,2628,1546],{"class":1269},[1256,2630,1549],{"class":1269},[1256,2632,2633],{"class":1293},"video",[1256,2635,1549],{"class":1269},[1256,2637,2638],{"class":1362}," video-id",[1256,2640,1546],{"class":1269},[1256,2642,1549],{"class":1269},[1256,2644,2645],{"class":1293},"d_IFKP1Ofq0",[1256,2647,1549],{"class":1269},[1256,2649,2650],{"class":1362}," @ready",[1256,2652,1546],{"class":1269},[1256,2654,1549],{"class":1269},[1256,2656,2657],{"class":1293},"isLoaded = true",[1256,2659,1549],{"class":1269},[1256,2661,2662],{"class":1362}," @state-change",[1256,2664,1546],{"class":1269},[1256,2666,1549],{"class":1269},[1256,2668,2669],{"class":1293},"stateChange",[1256,2671,1549],{"class":1269},[1256,2673,1366],{"class":1269},[1256,2675,2676,2679,2681,2684,2687],{"class":1258,"line":1851},[1256,2677,2678],{"class":1269},"    \u003C",[1256,2680,2614],{"class":1273},[1256,2682,2683],{"class":1269}," #",[1256,2685,2686],{"class":1362},"awaitingLoad",[1256,2688,1366],{"class":1269},[1256,2690,2691,2694,2697,2700,2702,2704,2707,2709],{"class":1258,"line":1856},[1256,2692,2693],{"class":1269},"      \u003C",[1256,2695,2696],{"class":1273},"div",[1256,2698,2699],{"class":1362}," class",[1256,2701,1546],{"class":1269},[1256,2703,1549],{"class":1269},[1256,2705,2706],{"class":1293},"absolute left-1/2 top-1/2 transform -translate-x-1/2 -translate-y-1/2 h-[48px] w-[68px]",[1256,2708,1549],{"class":1269},[1256,2710,1366],{"class":1269},[1256,2712,2713,2716,2719,2722,2724,2726,2729,2731,2734,2736,2738,2741,2743,2746,2748,2750,2753,2755,2758,2760,2762,2764,2766,2769,2771,2774,2776,2778,2781,2783,2786,2788,2790,2793,2795,2798,2800,2802,2804,2806,2809,2811,2813,2815,2817,2820,2822,2825,2827],{"class":1258,"line":2190},[1256,2714,2715],{"class":1269},"        \u003C",[1256,2717,2718],{"class":1273},"svg",[1256,2720,2721],{"class":1362}," height",[1256,2723,1546],{"class":1269},[1256,2725,1549],{"class":1269},[1256,2727,2728],{"class":1293},"100%",[1256,2730,1549],{"class":1269},[1256,2732,2733],{"class":1362}," version",[1256,2735,1546],{"class":1269},[1256,2737,1549],{"class":1269},[1256,2739,2740],{"class":1293},"1.1",[1256,2742,1549],{"class":1269},[1256,2744,2745],{"class":1362}," viewBox",[1256,2747,1546],{"class":1269},[1256,2749,1549],{"class":1269},[1256,2751,2752],{"class":1293},"0 0 68 48",[1256,2754,1549],{"class":1269},[1256,2756,2757],{"class":1362}," width",[1256,2759,1546],{"class":1269},[1256,2761,1549],{"class":1269},[1256,2763,2728],{"class":1293},[1256,2765,1549],{"class":1269},[1256,2767,2768],{"class":1269},">\u003C",[1256,2770,1511],{"class":1273},[1256,2772,2773],{"class":1362}," d",[1256,2775,1546],{"class":1269},[1256,2777,1549],{"class":1269},[1256,2779,2780],{"class":1293},"M66.52,7.74c-0.78-2.93-2.49-5.41-5.42-6.19C55.79,.13,34,0,34,0S12.21,.13,6.9,1.55 C3.97,2.33,2.27,4.81,1.48,7.74C0.06,13.05,0,24,0,24s0.06,10.95,1.48,16.26c0.78,2.93,2.49,5.41,5.42,6.19 C12.21,47.87,34,48,34,48s21.79-0.13,27.1-1.55c2.93-0.78,4.64-3.26,5.42-6.19C67.94,34.95,68,24,68,24S67.94,13.05,66.52,7.74z",[1256,2782,1549],{"class":1269},[1256,2784,2785],{"class":1362}," fill",[1256,2787,1546],{"class":1269},[1256,2789,1549],{"class":1269},[1256,2791,2792],{"class":1293},"#f00",[1256,2794,1549],{"class":1269},[1256,2796,2797],{"class":1269}," />\u003C",[1256,2799,1511],{"class":1273},[1256,2801,2773],{"class":1362},[1256,2803,1546],{"class":1269},[1256,2805,1549],{"class":1269},[1256,2807,2808],{"class":1293},"M 45,24 27,14 27,34",[1256,2810,1549],{"class":1269},[1256,2812,2785],{"class":1362},[1256,2814,1546],{"class":1269},[1256,2816,1549],{"class":1269},[1256,2818,2819],{"class":1293},"#fff",[1256,2821,1549],{"class":1269},[1256,2823,2824],{"class":1269}," />\u003C/",[1256,2826,2718],{"class":1273},[1256,2828,1366],{"class":1269},[1256,2830,2831,2834,2836],{"class":1258,"line":2200},[1256,2832,2833],{"class":1269},"      \u003C/",[1256,2835,2696],{"class":1273},[1256,2837,1366],{"class":1269},[1256,2839,2840,2843,2845],{"class":1258,"line":2221},[1256,2841,2842],{"class":1269},"    \u003C/",[1256,2844,2614],{"class":1273},[1256,2846,1366],{"class":1269},[1256,2848,2849,2852,2854],{"class":1258,"line":2227},[1256,2850,2851],{"class":1269},"  \u003C/",[1256,2853,2624],{"class":1273},[1256,2855,1366],{"class":1269},[1256,2857,2858,2860,2862],{"class":1258,"line":2232},[1256,2859,1423],{"class":1269},[1256,2861,2614],{"class":1273},[1256,2863,1366],{"class":1269},[1225,2865,2867],{"id":2866},"consent-management-element-event-triggers","Consent Management & Element Event Triggers",[1120,2869,1888,2870,2872,2873,2876,2877,2880],{},[1233,2871,2316],{}," composable gives you full control over how and when your scripts are loaded, by either providing a custom ",[1233,2874,2875],{},"trigger"," or manually calling the ",[1233,2878,2879],{},"load()"," function.",[1120,2882,2883],{},"Building on top of this, Nuxt Scripts provides advanced triggers to make it even easier.",[1329,2885,2886,2894],{},[1332,2887,2888,2893],{},[1124,2889,2892],{"href":2890,"rel":2891},"https://scripts.nuxt.com/docs/guides/consent",[1128],"Consent Management"," - Load scripts only after the user has given consent such as with a cookie banner.",[1332,2895,2896,2901],{},[1124,2897,2900],{"href":2898,"rel":2899},"https://scripts.nuxt.com/docs/guides/script-triggers#element-event-triggers",[1128],"Element Event Triggers"," - Load scripts based on user interactions such as scrolling, clicking, or form submissions.",[1247,2903,2905],{"className":1249,"code":2904,"language":1251,"meta":1252,"style":1252},"const cookieConsentTrigger = useScriptTriggerConsent()\nconst { proxy } = useScript\u003C{ greeting: () => void }>('/hello.js', {\n  // script will only be loaded once the consent has been accepted\n  trigger: cookieConsentTrigger\n})\n// ...\nfunction acceptCookies() {\n  cookieConsentTrigger.accept()\n}\n// greeting() is queued until the user accepts cookies\nproxy.greeting()\n",[1233,2906,2907,2921,2964,2969,2978,2984,2989,3000,3012,3016,3021],{"__ignoreMap":1252},[1256,2908,2909,2911,2914,2916,2919],{"class":1258,"line":1259},[1256,2910,2025],{"class":1362},[1256,2912,2913],{"class":1265}," cookieConsentTrigger ",[1256,2915,1546],{"class":1269},[1256,2917,2918],{"class":1262}," useScriptTriggerConsent",[1256,2920,2389],{"class":1265},[1256,2922,2923,2925,2927,2929,2931,2933,2935,2938,2940,2942,2944,2946,2949,2952,2954,2956,2958,2960,2962],{"class":1258,"line":1369},[1256,2924,2025],{"class":1362},[1256,2926,2028],{"class":1269},[1256,2928,2340],{"class":1265},[1256,2930,1318],{"class":1269},[1256,2932,2041],{"class":1269},[1256,2934,2044],{"class":1262},[1256,2936,2937],{"class":1269},"\u003C{",[1256,2939,2124],{"class":1273},[1256,2941,1277],{"class":1269},[1256,2943,2208],{"class":1269},[1256,2945,1587],{"class":1362},[1256,2947,2948],{"class":1712}," void",[1256,2950,2951],{"class":1269}," }>",[1256,2953,1266],{"class":1265},[1256,2955,1297],{"class":1269},[1256,2957,2051],{"class":1293},[1256,2959,1297],{"class":1269},[1256,2961,1300],{"class":1269},[1256,2963,1590],{"class":1269},[1256,2965,2966],{"class":1258,"line":1376},[1256,2967,2968],{"class":1372},"  // script will only be loaded once the consent has been accepted\n",[1256,2970,2971,2973,2975],{"class":1258,"line":1382},[1256,2972,2062],{"class":1273},[1256,2974,1277],{"class":1269},[1256,2976,2977],{"class":1265}," cookieConsentTrigger\n",[1256,2979,2980,2982],{"class":1258,"line":1388},[1256,2981,1318],{"class":1269},[1256,2983,1321],{"class":1265},[1256,2985,2986],{"class":1258,"line":1420},[1256,2987,2988],{"class":1372},"// ...\n",[1256,2990,2991,2993,2996,2998],{"class":1258,"line":1516},[1256,2992,2516],{"class":1362},[1256,2994,2995],{"class":1262}," acceptCookies",[1256,2997,1412],{"class":1269},[1256,2999,1590],{"class":1269},[1256,3001,3002,3005,3007,3010],{"class":1258,"line":1522},[1256,3003,3004],{"class":1265},"  cookieConsentTrigger",[1256,3006,1136],{"class":1269},[1256,3008,3009],{"class":1262},"accept",[1256,3011,2389],{"class":1273},[1256,3013,3014],{"class":1258,"line":1642},[1256,3015,1519],{"class":1269},[1256,3017,3018],{"class":1258,"line":1657},[1256,3019,3020],{"class":1372},"// greeting() is queued until the user accepts cookies\n",[1256,3022,3023,3025,3027,3029],{"class":1258,"line":1662},[1256,3024,2156],{"class":1265},[1256,3026,1136],{"class":1269},[1256,3028,2161],{"class":1262},[1256,3030,2389],{"class":1265},[1225,3032,3034],{"id":3033},"bundling-scripts","Bundling Scripts",[1120,3036,3037],{},"In many cases, we're loading third-party scripts from a domain that we don't control. This can lead to a number of issues:",[1329,3039,3040,3043,3046,3049],{},[1332,3041,3042],{},"Privacy: The third-party script can track users across sites.",[1332,3044,3045],{},"Security: The third-party script can be compromised and inject malicious code.",[1332,3047,3048],{},"Performance: Extra DNS lookups will slow down the page load.",[1332,3050,3051],{},"Developer Experience: Consented scripts may be blocked by ad blockers.",[1120,3053,3054],{},"To mitigate this, Nuxt Scripts provides a way to bundle third-party scripts into your public directory without any extra work.",[1247,3056,3058],{"className":1249,"code":3057,"language":1251,"meta":1252,"style":1252},"useScript('https://cdn.jsdelivr.net/npm/js-confetti@latest/dist/js-confetti.browser.js', {\n  bundle: true,\n})\n",[1233,3059,3060,3077,3088],{"__ignoreMap":1252},[1256,3061,3062,3064,3066,3068,3071,3073,3075],{"class":1258,"line":1259},[1256,3063,2316],{"class":1262},[1256,3065,1266],{"class":1265},[1256,3067,1297],{"class":1269},[1256,3069,3070],{"class":1293},"https://cdn.jsdelivr.net/npm/js-confetti@latest/dist/js-confetti.browser.js",[1256,3072,1297],{"class":1269},[1256,3074,1300],{"class":1269},[1256,3076,1590],{"class":1269},[1256,3078,3079,3082,3084,3086],{"class":1258,"line":1369},[1256,3080,3081],{"class":1273},"  bundle",[1256,3083,1277],{"class":1269},[1256,3085,1309],{"class":1308},[1256,3087,2073],{"class":1269},[1256,3089,3090,3092],{"class":1258,"line":1376},[1256,3091,1318],{"class":1269},[1256,3093,1321],{"class":1265},[1120,3095,3096,3097,3100],{},"The script will now be served from ",[1233,3098,3099],{},"/_scripts/{hash}"," on your own domain.",[1153,3102,3104],{"id":3103},"to-be-continued","To be continued",[1120,3106,3107],{},"As we saw, there are many opportunities to improve third-party scripts for developers and end-users.",[1120,3109,3110,3111,3114],{},"The initial release of Nuxt Scripts has solved ",[1925,3112,3113],{},"some"," of these issues, but there's still a lot of work ahead of us.",[1120,3116,3117],{},"The next items on the roadmap are:",[1329,3119,3120,3127,3134,3141],{},[1332,3121,3122],{},[1124,3123,3126],{"href":3124,"rel":3125},"https://github.com/nuxt/scripts/issues/182",[1128],"Add web worker support (Partytown)",[1332,3128,3129],{},[1124,3130,3133],{"href":3131,"rel":3132},"https://github.com/nuxt/scripts/issues/44",[1128],"More Live Chat Facade Components",[1332,3135,3136],{},[1124,3137,3140],{"href":3138,"rel":3139},"https://github.com/nuxt/scripts/issues/87",[1128],"Offload Scripts To Nuxt Server Proxy",[1332,3142,3143],{},[1124,3144,3147],{"href":3145,"rel":3146},"https://github.com/nuxt/scripts/issues/131",[1128],"Iframe Script Sandboxing",[1120,3149,3150],{},"We'd love to have your contribution and support.",[1153,3152,3154],{"id":3153},"getting-started","Getting started",[1120,3156,3157,3158,3163],{},"To get started with Nuxt Scripts, we've created a ",[1124,3159,3162],{"href":3160,"rel":3161},"https://scripts.nuxt.com/docs/getting-started/confetti-tutorial",[1128],"tutorial"," to help you get up and running.",[1153,3165,3167],{"id":3166},"credits","Credits",[1329,3169,3170,3177,3185,3192],{},[1332,3171,3172,3176],{},[1124,3173,3175],{"href":1114,"rel":3174},[1128],"Harlan Wilton - Nuxt"," (author)",[1332,3178,3179,3184],{},[1124,3180,3183],{"href":3181,"rel":3182},"https://github.com/huang-julien",[1128],"Julien Huang - Nuxt"," (contributor)",[1332,3186,3187,3184],{},[1124,3188,3191],{"href":3189,"rel":3190},"https://github.com/danielroe",[1128],"Daniel Roe - Nuxt",[1332,3193,3194,3184],{},[1124,3195,3197],{"href":1126,"rel":3196},[1128],"Chrome Aurora - Google",[1120,3199,3200],{},"And a big thank you to the early contributors.",[1120,3202,3203],{},[1143,3204],{"alt":3205,"className":3206,"src":3207},"Nuxt Scripts Contributors",[1147,1148,1149,1150],"/assets/blog/nuxt-scripts/contributors.png",[3209,3210,3211],"style",{},"html pre.shiki code .szd4z, html code.shiki .szd4z{--shiki-light:#6182B8;--shiki-default:#6182B8;--shiki-dark:#82AAFF}html pre.shiki code .spdxX, html code.shiki .spdxX{--shiki-light:#90A4AE;--shiki-default:#90A4AE;--shiki-dark:#BABED8}html pre.shiki code .sYp4K, html code.shiki .sYp4K{--shiki-light:#39ADB5;--shiki-default:#39ADB5;--shiki-dark:#89DDFF}html pre.shiki code .sQ5dg, html code.shiki .sQ5dg{--shiki-light:#E53935;--shiki-default:#E53935;--shiki-dark:#F07178}html pre.shiki code .s5UST, html code.shiki .s5UST{--shiki-light:#91B859;--shiki-default:#91B859;--shiki-dark:#C3E88D}html pre.shiki code .sagxc, html code.shiki .sagxc{--shiki-light:#FF5370;--shiki-default:#FF5370;--shiki-dark:#FF9CAC}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 .sRBFq, html code.shiki .sRBFq{--shiki-light:#9C3EDA;--shiki-default:#9C3EDA;--shiki-dark:#C792EA}html pre.shiki code .svXlt, html code.shiki .svXlt{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#90A4AE;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}html pre.shiki code .sFVN2, html code.shiki .sFVN2{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#39ADB5;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sV9sa, html code.shiki .sV9sa{--shiki-light:#F76D47;--shiki-default:#F76D47;--shiki-dark:#F78C6C}html pre.shiki code .sT2Ow, html code.shiki .sT2Ow{--shiki-light:#E2931D;--shiki-default:#E2931D;--shiki-dark:#FFCB6B}html pre.shiki code .ssYd4, html code.shiki .ssYd4{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#90A4AE;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}",{"title":1252,"searchDepth":1369,"depth":1369,"links":3213},[3214,3215,3221,3228,3229,3230],{"id":1155,"depth":1369,"text":1156},{"id":1194,"depth":1369,"text":1195,"children":3216},[3217,3218,3219],{"id":1227,"depth":1376,"text":1228},{"id":1865,"depth":1376,"text":1866},{"id":1922,"depth":1376,"text":3220},"🛡️ Privacy & Security: Do no evil?",{"id":1953,"depth":1369,"text":1954,"children":3222},[3223,3224,3225,3226,3227],{"id":1957,"depth":1376,"text":1958},{"id":2294,"depth":1376,"text":2295},{"id":2392,"depth":1376,"text":2393},{"id":2866,"depth":1376,"text":2867},{"id":3033,"depth":1376,"text":3034},{"id":3103,"depth":1369,"text":3104},{"id":3153,"depth":1369,"text":3154},{"id":3166,"depth":1369,"text":3167},"Release","2024-08-20","Nuxt Scripts provides better performance, privacy, security, and developer experience for third-party scripts.","md",{},{"title":1064,"description":3233},"2kSybZrWSL",[3239,3241],{"title":1068,"path":1069,"stem":1070,"description":3240,"children":-1},"Discover Nuxt Icon v1 - a modern, versatile, and customizable icon solution for your Nuxt projects.",{"title":1080,"path":1081,"stem":1082,"description":3242,"children":-1},"Nuxt 2 will reach End of Life (EOL) on June 30th, 2024. We've partnered with HeroDevs on offering Never-Ending Support (NES).",1742651340753]