CINXE.COM

<!DOCTYPE html><html lang="en" class="scroll-pt-[76px] theme-clean no-tint sidebar-filled sidebar-list-pill"><head><meta charSet="utf-8"/><link rel="preconnect" href="https://api.gitbook.com"/><link rel="preconnect" href="https://static.gitbook.com"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="preload" as="image" imageSrcSet="https://www.electronforge.io/~gitbook/image?url=https%3A%2F%2F2355537583-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252F-LBKK1y7h_XWAtuRJG9X-4037718589%252Ficon%252FzSCYXfXdUPvs7AL9g6NO%252FElectron_Software_Framework_Logo.svg%2520%281%29.png%3Falt%3Dmedia%26token%3D325f86f6-2e2a-4d0f-a8c7-b28d4eea56a4&width=32&dpr=1&quality=100&sign=2d940ca3&sv=2 32w, https://www.electronforge.io/~gitbook/image?url=https%3A%2F%2F2355537583-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252F-LBKK1y7h_XWAtuRJG9X-4037718589%252Ficon%252FzSCYXfXdUPvs7AL9g6NO%252FElectron_Software_Framework_Logo.svg%2520%281%29.png%3Falt%3Dmedia%26token%3D325f86f6-2e2a-4d0f-a8c7-b28d4eea56a4&width=32&dpr=2&quality=100&sign=2d940ca3&sv=2 64w, https://www.electronforge.io/~gitbook/image?url=https%3A%2F%2F2355537583-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252F-LBKK1y7h_XWAtuRJG9X-4037718589%252Ficon%252FzSCYXfXdUPvs7AL9g6NO%252FElectron_Software_Framework_Logo.svg%2520%281%29.png%3Falt%3Dmedia%26token%3D325f86f6-2e2a-4d0f-a8c7-b28d4eea56a4&width=32&dpr=3&quality=100&sign=2d940ca3&sv=2 96w, https://www.electronforge.io/~gitbook/image?url=https%3A%2F%2F2355537583-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252F-LBKK1y7h_XWAtuRJG9X-4037718589%252Ficon%252FzSCYXfXdUPvs7AL9g6NO%252FElectron_Software_Framework_Logo.svg%2520%281%29.png%3Falt%3Dmedia%26token%3D325f86f6-2e2a-4d0f-a8c7-b28d4eea56a4&width=32&dpr=4&quality=100&sign=2d940ca3&sv=2 128w" imageSizes="32px" fetchPriority="high"/><link rel="stylesheet" href="https://static.gitbook.com/_next/static/css/9f5478b23a2dbc0b.css" data-precedence="next"/><link rel="stylesheet" href="https://static.gitbook.com/_next/static/css/c689b5a6a1432db7.css" data-precedence="next"/><link rel="stylesheet" href="https://static.gitbook.com/_next/static/css/619939f8b811f942.css" data-precedence="next"/><link rel="stylesheet" href="https://static.gitbook.com/_next/static/css/95b358fb5c9305a3.css" data-precedence="next"/><link rel="stylesheet" href="https://static.gitbook.com/_next/static/css/09a5087aafb66ce5.css" data-precedence="next"/><link rel="stylesheet" href="https://static.gitbook.com/_next/static/css/faa0908d2237c5e3.css" data-precedence="next"/><link rel="stylesheet" href="https://static.gitbook.com/_next/static/css/9008e36b498d813c.css" data-precedence="next"/><link rel="stylesheet" href="https://static.gitbook.com/_next/static/css/2567c890e467e55b.css" data-precedence="next"/><link rel="stylesheet" href="https://static.gitbook.com/_next/static/css/79eda1c72751119a.css" data-precedence="next"/><link rel="stylesheet" href="https://static.gitbook.com/_next/static/css/4af9aafd612346fe.css" data-precedence="next"/><link rel="preload" as="script" fetchPriority="low" nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx" href="https://static.gitbook.com/_next/static/chunks/webpack-ff813e9d416ce230.js"/><script src="https://static.gitbook.com/_next/static/chunks/1dd3208c-d78985df41c8a89e.js" async="" nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx"></script><script src="https://static.gitbook.com/_next/static/chunks/4850-4b0a9d49477fe59a.js" async="" nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx"></script><script src="https://static.gitbook.com/_next/static/chunks/main-app-7fd574d08c26dd48.js" async="" nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx"></script><script src="https://static.gitbook.com/_next/static/chunks/app/global-error-185b8d6d9c549d21.js" async="" nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx"></script><script src="https://static.gitbook.com/_next/static/chunks/9322-5f5740cd5fd0bdf9.js" async="" nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx"></script><script src="https://static.gitbook.com/_next/static/chunks/app/middleware/(site)/layout-1a4e0bf6da1d58a4.js" async="" nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx"></script><script src="https://static.gitbook.com/_next/static/chunks/2622-d4284e72be418b70.js" async="" nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx"></script><script src="https://static.gitbook.com/_next/static/chunks/7609-5073804535dff38c.js" async="" nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx"></script><script src="https://static.gitbook.com/_next/static/chunks/983-4fad0180b495256f.js" async="" nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx"></script><script src="https://static.gitbook.com/_next/static/chunks/app/middleware/(site)/error-65349dd045e81a2f.js" async="" nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx"></script><script src="https://static.gitbook.com/_next/static/chunks/2999-584f9b8ecc233405.js" async="" nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx"></script><script src="https://static.gitbook.com/_next/static/chunks/7993-8ef7f7477490b7af.js" async="" nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx"></script><script src="https://static.gitbook.com/_next/static/chunks/5890-3ab2501336ce1348.js" async="" nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx"></script><script src="https://static.gitbook.com/_next/static/chunks/3625-453944d6ea4368cb.js" async="" nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx"></script><script src="https://static.gitbook.com/_next/static/chunks/4055-7666845ca98fb1a4.js" async="" nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx"></script><script src="https://static.gitbook.com/_next/static/chunks/app/middleware/(site)/(content)/layout-1043f1693da1ab25.js" async="" nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx"></script><script async="" src="https://integrations.gitbook.com/v1/integrations/googleanalytics/installations/e065268d3cfde995f1ec1f24663200b92f6579eef7efe5f0273305a8d9f077ce/sites/site_S8gms/script.js?version=150.0" nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx"></script><script src="https://static.gitbook.com/_next/static/chunks/5572-d068cc2bc8e73d12.js" async="" nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx"></script><script src="https://static.gitbook.com/_next/static/chunks/8843-f0d01ada04c351a9.js" async="" nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx"></script><script src="https://static.gitbook.com/_next/static/chunks/4168-0a5038a89c61b229.js" async="" nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx"></script><script src="https://static.gitbook.com/_next/static/chunks/app/middleware/(site)/(content)/%5B%5B...pathname%5D%5D/page-a1cb1652fa802fac.js" async="" nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx"></script><meta name="color-scheme" content="light dark"/><title>Vue 3 | Electron Forge</title><meta name="description" content="How to create an Electron app with Vue and Electron Forge"/><meta name="generator" content="GitBook (f8d4c76)"/><meta name="robots" content="index, follow"/><link rel="canonical" href="https://www.electronforge.io/guides/framework-integration/vue-3"/><meta property="og:title" content="Vue 3 | Electron Forge"/><meta property="og:description" content="How to create an Electron app with Vue and Electron Forge"/><meta property="og:image" content="https://www.electronforge.io/~gitbook/ogimage/LEvXayS14hE8oOvpcGPB"/><meta name="twitter:card" content="summary_large_image"/><meta name="twitter:title" content="Vue 3 | Electron Forge"/><meta name="twitter:description" content="How to create an Electron app with Vue and Electron Forge"/><meta name="twitter:image" content="https://www.electronforge.io/~gitbook/ogimage/LEvXayS14hE8oOvpcGPB"/><link rel="icon" href="https://2355537583-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LBKK1y7h_XWAtuRJG9X-4037718589%2Ficon%2FzSCYXfXdUPvs7AL9g6NO%2FElectron_Software_Framework_Logo.svg%20(1).png?alt=media&token=325f86f6-2e2a-4d0f-a8c7-b28d4eea56a4" type="image/png" media="(prefers-color-scheme: light)"/><link rel="icon" href="https://2355537583-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LBKK1y7h_XWAtuRJG9X-4037718589%2Ficon%2FzSCYXfXdUPvs7AL9g6NO%2FElectron_Software_Framework_Logo.svg%20(1).png?alt=media&token=325f86f6-2e2a-4d0f-a8c7-b28d4eea56a4" type="image/png" media="(prefers-color-scheme: dark)"/><meta name="next-size-adjust"/><style> :root { --primary-1: 251 255 255; --contrast-primary-1: 29 29 29; --primary-2: 243 251 255; --contrast-primary-2: 29 29 29; --primary-3: 237 248 255; --contrast-primary-3: 29 29 29; --primary-4: 228 243 255; --contrast-primary-4: 29 29 29; --primary-5: 219 239 255; --contrast-primary-5: 29 29 29; --primary-6: 208 231 255; --contrast-primary-6: 29 29 29; --primary-7: 192 219 255; --contrast-primary-7: 29 29 29; --primary-8: 176 206 254; --contrast-primary-8: 29 29 29; --primary-9: 27 98 209; --contrast-primary-9: 255 255 255; --primary-10: 46 116 228; --contrast-primary-10: 255 255 255; --primary-11: 33 104 215; --contrast-primary-11: 255 255 255; --primary-12: 0 0 113; --contrast-primary-12: 255 255 255; --primary-original: 27 98 209; --contrast-primary-original: 255 255 255; --tint-1: 254 255 255; --contrast-tint-1: 29 29 29; --tint-2: 248 250 252; --contrast-tint-2: 29 29 29; --tint-3: 245 248 251; --contrast-tint-3: 29 29 29; --tint-4: 239 242 247; --contrast-tint-4: 29 29 29; --tint-5: 234 237 244; --contrast-tint-5: 29 29 29; --tint-6: 225 230 237; --contrast-tint-6: 29 29 29; --tint-7: 212 217 226; --contrast-tint-7: 29 29 29; --tint-8: 199 205 214; --contrast-tint-8: 29 29 29; --tint-9: 120 134 156; --contrast-tint-9: 255 255 255; --tint-10: 109 122 144; --contrast-tint-10: 255 255 255; --tint-11: 98 111 132; --contrast-tint-11: 255 255 255; --tint-12: 19 29 46; --contrast-tint-12: 255 255 255; --tint-original: 120 120 120; --contrast-tint-original: 255 255 255; --neutral-1: 255 255 255; --contrast-neutral-1: 29 29 29; --neutral-2: 250 250 250; --contrast-neutral-2: 29 29 29; --neutral-3: 247 247 247; --contrast-neutral-3: 29 29 29; --neutral-4: 242 242 242; --contrast-neutral-4: 29 29 29; --neutral-5: 237 237 237; --contrast-neutral-5: 29 29 29; --neutral-6: 229 229 229; --contrast-neutral-6: 29 29 29; --neutral-7: 217 217 217; --contrast-neutral-7: 29 29 29; --neutral-8: 204 204 204; --contrast-neutral-8: 29 29 29; --neutral-9: 120 120 120; --contrast-neutral-9: 255 255 255; --neutral-10: 121 121 121; --contrast-neutral-10: 255 255 255; --neutral-11: 110 110 110; --contrast-neutral-11: 255 255 255; --neutral-12: 29 29 29; --contrast-neutral-12: 255 255 255; --neutral-original: 120 120 120; --contrast-neutral-original: 255 255 255; --header-background: 27 98 209; --header-link: 255 255 255; } .dark { --primary-1: 27 29 34; --contrast-primary-1: 255 255 255; --primary-2: 29 35 44; --contrast-primary-2: 255 255 255; --primary-3: 36 44 58; --contrast-primary-3: 255 255 255; --primary-4: 37 48 67; --contrast-primary-4: 255 255 255; --primary-5: 39 54 77; --contrast-primary-5: 255 255 255; --primary-6: 40 58 86; --contrast-primary-6: 255 255 255; --primary-7: 47 68 102; --contrast-primary-7: 255 255 255; --primary-8: 53 78 118; --contrast-primary-8: 255 255 255; --primary-9: 27 98 209; --contrast-primary-9: 255 255 255; --primary-10: 70 140 255; --contrast-primary-10: 255 255 255; --primary-11: 117 190 255; --contrast-primary-11: 29 29 29; --primary-12: 178 255 255; --contrast-primary-12: 29 29 29; --primary-original: 27 98 209; --contrast-primary-original: 255 255 255; --tint-1: 29 29 29; --contrast-tint-1: 255 255 255; --tint-2: 34 35 35; --contrast-tint-2: 255 255 255; --tint-3: 43 44 45; --contrast-tint-3: 255 255 255; --tint-4: 47 48 50; --contrast-tint-4: 255 255 255; --tint-5: 52 54 56; --contrast-tint-5: 255 255 255; --tint-6: 56 58 60; --contrast-tint-6: 255 255 255; --tint-7: 66 68 71; --contrast-tint-7: 255 255 255; --tint-8: 75 78 82; --contrast-tint-8: 255 255 255; --tint-9: 126 133 144; --contrast-tint-9: 255 255 255; --tint-10: 138 145 156; --contrast-tint-10: 255 255 255; --tint-11: 185 193 204; --contrast-tint-11: 29 29 29; --tint-12: 248 255 255; --contrast-tint-12: 29 29 29; --tint-original: 120 120 120; --contrast-tint-original: 255 255 255; --neutral-1: 29 29 29; --contrast-neutral-1: 255 255 255; --neutral-2: 34 34 34; --contrast-neutral-2: 255 255 255; --neutral-3: 44 44 44; --contrast-neutral-3: 255 255 255; --neutral-4: 48 48 48; --contrast-neutral-4: 255 255 255; --neutral-5: 53 53 53; --contrast-neutral-5: 255 255 255; --neutral-6: 57 57 57; --contrast-neutral-6: 255 255 255; --neutral-7: 67 67 67; --contrast-neutral-7: 255 255 255; --neutral-8: 78 78 78; --contrast-neutral-8: 255 255 255; --neutral-9: 120 120 120; --contrast-neutral-9: 255 255 255; --neutral-10: 144 144 144; --contrast-neutral-10: 255 255 255; --neutral-11: 192 192 192; --contrast-neutral-11: 29 29 29; --neutral-12: 255 255 255; --contrast-neutral-12: 29 29 29; --neutral-original: 120 120 120; --contrast-neutral-original: 255 255 255; --header-background: 27 98 209; --header-link: 255 255 255; } </style><script src="https://static.gitbook.com/_next/static/chunks/polyfills-42372ed130431b0a.js" noModule="" nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx"></script></head><body class="__className_2f5617 __className_7d852e __variable_96046e bg-tint-base theme-muted:bg-tint-subtle theme-bold-tint:bg-tint-subtle theme-gradient:bg-gradient-primary theme-gradient-tint:bg-gradient-tint"><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">!function(){try{var d=document.documentElement,c=d.classList;c.remove('light','dark');var e=localStorage.getItem('theme');if('system'===e||(!e&&true)){var t='(prefers-color-scheme: dark)',m=window.matchMedia(t);if(m.media!==t||m.matches){d.style.colorScheme = 'dark';c.add('dark')}else{d.style.colorScheme = 'light';c.add('light')}}else if(e){c.add(e|| '')}if(e==='light'||e==='dark')d.style.colorScheme=e}catch(e){}}()</script><header id="site-header" class="flex flex-col h-[64px] sticky top-0 z-10 w-full flex-none shadow-[0px_1px_0px] shadow-tint-12/2 bg-tint-base/9 theme-muted:bg-tint-subtle/9 theme-bold-tint:bg-tint-subtle/9 theme-gradient:bg-gradient-primary theme-gradient-tint:bg-gradient-tint contrast-more:bg-tint-base text-sm backdrop-blur-lg"><div class="theme-bold:bg-header-background theme-bold:shadow-[0px_1px_0px] theme-bold:shadow-tint-12/2"><div class="scroll-nojump"><div class="gap-4 lg:gap-8 flex items-center justify-between w-full py-3 min-h-16 sm:h-16 px-4 sm:px-6 md:px-8 max-w-screen-2xl mx-auto page-full-width:max-w-full"><div class="flex max-w-full shrink min-w-0 gap-2 lg:gap-4 justify-start items-center"><button class="flex flex-row items-center py-1 px-2 rounded straight-corners:rounded-sm page-no-toc:hidden lg:hidden -ml-2 text-tint-strong theme-bold:text-header-link hover:bg-tint-hover theme-bold:hover:bg-header-link/3" aria-label="Open table of contents"><svg style="mask-image:url(https://ka-p.fontawesome.com/releases/v6.6.0/svgs/regular/bars.svg?v=2&token=a463935e93);mask-repeat:no-repeat;mask-position:center" class="gb-icon size-4 text-inherit"></svg></button><a class="group/headerlogo min-w-0 shrink flex items-center" href="/"><img alt="" style="aspect-ratio:1" fetchPriority="high" class="block dark:hidden object-contain size-8" src="https://www.electronforge.io/~gitbook/image?url=https%3A%2F%2F2355537583-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252F-LBKK1y7h_XWAtuRJG9X-4037718589%252Ficon%252FzSCYXfXdUPvs7AL9g6NO%252FElectron_Software_Framework_Logo.svg%2520%281%29.png%3Falt%3Dmedia%26token%3D325f86f6-2e2a-4d0f-a8c7-b28d4eea56a4&width=32&dpr=4&quality=100&sign=2d940ca3&sv=2" srcSet="https://www.electronforge.io/~gitbook/image?url=https%3A%2F%2F2355537583-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252F-LBKK1y7h_XWAtuRJG9X-4037718589%252Ficon%252FzSCYXfXdUPvs7AL9g6NO%252FElectron_Software_Framework_Logo.svg%2520%281%29.png%3Falt%3Dmedia%26token%3D325f86f6-2e2a-4d0f-a8c7-b28d4eea56a4&width=32&dpr=1&quality=100&sign=2d940ca3&sv=2 32w, https://www.electronforge.io/~gitbook/image?url=https%3A%2F%2F2355537583-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252F-LBKK1y7h_XWAtuRJG9X-4037718589%252Ficon%252FzSCYXfXdUPvs7AL9g6NO%252FElectron_Software_Framework_Logo.svg%2520%281%29.png%3Falt%3Dmedia%26token%3D325f86f6-2e2a-4d0f-a8c7-b28d4eea56a4&width=32&dpr=2&quality=100&sign=2d940ca3&sv=2 64w, https://www.electronforge.io/~gitbook/image?url=https%3A%2F%2F2355537583-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252F-LBKK1y7h_XWAtuRJG9X-4037718589%252Ficon%252FzSCYXfXdUPvs7AL9g6NO%252FElectron_Software_Framework_Logo.svg%2520%281%29.png%3Falt%3Dmedia%26token%3D325f86f6-2e2a-4d0f-a8c7-b28d4eea56a4&width=32&dpr=3&quality=100&sign=2d940ca3&sv=2 96w, https://www.electronforge.io/~gitbook/image?url=https%3A%2F%2F2355537583-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252F-LBKK1y7h_XWAtuRJG9X-4037718589%252Ficon%252FzSCYXfXdUPvs7AL9g6NO%252FElectron_Software_Framework_Logo.svg%2520%281%29.png%3Falt%3Dmedia%26token%3D325f86f6-2e2a-4d0f-a8c7-b28d4eea56a4&width=32&dpr=4&quality=100&sign=2d940ca3&sv=2 128w" sizes="32px" width="1200" height="1200"/><img alt="" style="aspect-ratio:1" loading="lazy" fetchPriority="high" class="hidden dark:block object-contain size-8" src="https://www.electronforge.io/~gitbook/image?url=https%3A%2F%2F2355537583-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252F-LBKK1y7h_XWAtuRJG9X-4037718589%252Ficon%252FzSCYXfXdUPvs7AL9g6NO%252FElectron_Software_Framework_Logo.svg%2520%281%29.png%3Falt%3Dmedia%26token%3D325f86f6-2e2a-4d0f-a8c7-b28d4eea56a4&width=32&dpr=4&quality=100&sign=2d940ca3&sv=2" srcSet="https://www.electronforge.io/~gitbook/image?url=https%3A%2F%2F2355537583-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252F-LBKK1y7h_XWAtuRJG9X-4037718589%252Ficon%252FzSCYXfXdUPvs7AL9g6NO%252FElectron_Software_Framework_Logo.svg%2520%281%29.png%3Falt%3Dmedia%26token%3D325f86f6-2e2a-4d0f-a8c7-b28d4eea56a4&width=32&dpr=1&quality=100&sign=2d940ca3&sv=2 32w, https://www.electronforge.io/~gitbook/image?url=https%3A%2F%2F2355537583-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252F-LBKK1y7h_XWAtuRJG9X-4037718589%252Ficon%252FzSCYXfXdUPvs7AL9g6NO%252FElectron_Software_Framework_Logo.svg%2520%281%29.png%3Falt%3Dmedia%26token%3D325f86f6-2e2a-4d0f-a8c7-b28d4eea56a4&width=32&dpr=2&quality=100&sign=2d940ca3&sv=2 64w, https://www.electronforge.io/~gitbook/image?url=https%3A%2F%2F2355537583-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252F-LBKK1y7h_XWAtuRJG9X-4037718589%252Ficon%252FzSCYXfXdUPvs7AL9g6NO%252FElectron_Software_Framework_Logo.svg%2520%281%29.png%3Falt%3Dmedia%26token%3D325f86f6-2e2a-4d0f-a8c7-b28d4eea56a4&width=32&dpr=3&quality=100&sign=2d940ca3&sv=2 96w, https://www.electronforge.io/~gitbook/image?url=https%3A%2F%2F2355537583-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252F-LBKK1y7h_XWAtuRJG9X-4037718589%252Ficon%252FzSCYXfXdUPvs7AL9g6NO%252FElectron_Software_Framework_Logo.svg%2520%281%29.png%3Falt%3Dmedia%26token%3D325f86f6-2e2a-4d0f-a8c7-b28d4eea56a4&width=32&dpr=4&quality=100&sign=2d940ca3&sv=2 128w" sizes="32px" width="1200" height="1200"/><div class="text-pretty line-clamp-3 tracking-tight max-w-[18ch] lg:max-w-[24ch] font-semibold ms-3 text-base/tight lg:text-lg/tight text-tint-strong theme-bold:text-header-link">Electron Forge</div></a></div><div class="flex md:min-w-56 grow-0 shrink-0 justify-self-end"><button type="button" aria-label="Search" class="flex flex-1 flex-row justify-center items-center w-full px-3 py-2 gap-2 bg-tint-base ring-1 ring-tint-12/2 shadow-sm shadow-tint-12/3 dark:shadow-none text-tint rounded-lg straight-corners:rounded-sm contrast-more:ring-tint-12 contrast-more:text-tint-strong transition-all hover:bg-tint-subtle hover:shadow-md hover:scale-102 hover:ring-tint-hover hover:text-tint-strong focus:shadow-md focus:scale-102 focus:ring-tint-hover focus:text-tint-strong contrast-more:hover:ring-2 contrast-more:hover:ring-tint-12 contrast-more:focus:ring-2 contrast-more:focus:ring-tint-12 active:shadow-sm active:scale-98 md:justify-start md:w-full theme-bold:bg-header-link/2 theme-bold:hover:bg-header-link/3 theme-bold:text-header-link/8 theme-bold:hover:text-header-link theme-bold:ring-header-link/4 theme-bold:hover:ring-header-link/5 theme-bold:[&_svg]:text-header-link/10 theme-bold:[&_.shortcut]:text-header-link/8 theme-bold:contrast-more:bg-header-background theme-bold:contrast-more:text-header-link theme-bold:contrast-more:ring-header-link theme-bold:contrast-more:hover:bg-header-background theme-bold:contrast-more:hover:ring-header-link theme-bold:contrast-more:focus:text-header-link theme-bold:contrast-more:focus:bg-header-background theme-bold:contrast-more:focus:ring-header-link theme-bold:shadow-none theme-bold:hover:shadow-none"><svg style="mask-image:url(https://ka-p.fontawesome.com/releases/v6.6.0/svgs/regular/magnifying-glass.svg?v=2&token=a463935e93);mask-repeat:no-repeat;mask-position:center" class="gb-icon text-tint-subtle shrink-0 size-4"></svg><div class="w-full hidden md:block text-left"><span class="flex-1">Search...</span></div><div class="shortcut hidden md:inline justify-end text-xs text-tint contrast-more:text-tint-strong whitespace-nowrap [font-feature-settings:"calt",_"case"]">Ctrl +鈥咾</div></button></div></div></div></div></header><div class="flex flex-col lg:flex-row px-4 sm:px-6 md:px-8 max-w-screen-2xl mx-auto page-full-width:max-w-full min-h-[calc(100vh-64px)]"><aside data-testid="table-of-contents" class="group page-no-toc:hidden grow-0 shrink-0 basis-full lg:basis-72 relative z-[1] lg:sticky lg:top-0 lg:h-screen site-header:lg:top-16 site-header:lg:h-[calc(100vh_-_4rem)] site-header-sections:lg:top-[6.75rem] site-header-sections:lg:h-[calc(100vh_-_6.75rem)] pt-6 pb-4 sidebar-filled:lg:pr-6 hidden navigation-open:flex lg:flex flex-col gap-4 navigation-open:border-b border-tint-subtle"><div class="lg:-ms-5 overflow-hidden relative flex flex-col flex-grow sidebar-filled:bg-tint-subtle theme-muted:bg-tint-subtle theme-bold-tint:bg-tint-subtle [html.sidebar-filled.theme-muted_&]:bg-tint-base [html.sidebar-filled.theme-bold.tint_&]:bg-tint-base sidebar-filled:rounded-xl straight-corners:rounded-none"><div class="px-5 *:my-4"></div><div data-testid="toc-scroll-container" class="flex flex-grow flex-col p-2 lg:pb-20 overflow-y-auto lg:gutter-stable [&::-webkit-scrollbar]:bg-transparent [&::-webkit-scrollbar-thumb]:bg-transparent group-hover:[&::-webkit-scrollbar]:bg-tint-subtle group-hover:[&::-webkit-scrollbar-thumb]:bg-tint-7 group-hover:[&::-webkit-scrollbar-thumb:hover]:bg-tint-8"><ul class="flex flex-col gap-y-0.5 sidebar-list-line:border-l border-tint-subtle"><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/">Getting Started</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/import-existing-project">Importing an Existing Project</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/cli">CLI</a></li><li class="flex flex-col group/page-group-item"><div class="flex items-center gap-3 px-3 z-[1] sticky -top-5 pt-6 group-first/page-group-item:-mt-5 pb-3 -mb-1.5 text-xs tracking-wide font-semibold uppercase [mask-image:linear-gradient(rgba(0,0,0,1)_70%,rgba(0,0,0,0))] bg-tint-base sidebar-filled:bg-tint-subtle theme-muted:bg-tint-subtle theme-bold-tint:bg-tint-subtle [html.sidebar-filled.theme-muted_&]:bg-tint-base [html.sidebar-filled.theme-bold.tint_&]:bg-tint-base [html.sidebar-default.theme-gradient_&]:bg-gradient-primary [html.sidebar-default.theme-gradient.tint_&]:bg-gradient-tint">Core Concepts</div><ul class="flex flex-col gap-y-0.5"><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/core-concepts/why-electron-forge">Why Electron Forge?</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/core-concepts/build-lifecycle">Build Lifecycle</a></li></ul></li><li class="flex flex-col group/page-group-item"><div class="flex items-center gap-3 px-3 z-[1] sticky -top-5 pt-6 group-first/page-group-item:-mt-5 pb-3 -mb-1.5 text-xs tracking-wide font-semibold uppercase [mask-image:linear-gradient(rgba(0,0,0,1)_70%,rgba(0,0,0,0))] bg-tint-base sidebar-filled:bg-tint-subtle theme-muted:bg-tint-subtle theme-bold-tint:bg-tint-subtle [html.sidebar-filled.theme-muted_&]:bg-tint-base [html.sidebar-filled.theme-bold.tint_&]:bg-tint-base [html.sidebar-default.theme-gradient_&]:bg-gradient-primary [html.sidebar-default.theme-gradient.tint_&]:bg-gradient-tint">Configuration</div><ul class="flex flex-col gap-y-0.5"><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/configuration">Configuration Overview</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/typescript-configuration">TypeScript Setup</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/plugins">Plugins<span class="group relative rounded-full straight-corners:rounded-sm w-5 h-5 after:grid-area-1-1 after:absolute after:-top-1 after:grid after:-left-1 after:w-7 after:h-7 hover:bg-tint-active hover:text-current"><svg style="mask-image:url(https://ka-p.fontawesome.com/releases/v6.6.0/svgs/regular/chevron-right.svg?v=2&token=a463935e93);mask-repeat:no-repeat;mask-position:center" class="gb-icon grid flex-shrink-0 size-3 m-1 text-current transition-transform opacity-6 group-hover:opacity-11 contrast-more:opacity-11 rotate-0"></svg></span></a><div class="[&_ul>li]:opacity-1" style="opacity:0;height:0px;display:none"><ul class="flex flex-col gap-y-0.5 ml-5 my-2 border-tint-subtle sidebar-list-default:border-l sidebar-list-line:border-l"><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/plugins/webpack">Webpack Plugin</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/plugins/vite">Vite Plugin</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/plugins/electronegativity">Electronegativity Plugin</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/plugins/auto-unpack-natives">Auto Unpack Native Modules Plugin</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/plugins/local-electron">Local Electron Plugin</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/plugins/fuses">Fuses Plugin</a></li></ul></div></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/makers">Makers<span class="group relative rounded-full straight-corners:rounded-sm w-5 h-5 after:grid-area-1-1 after:absolute after:-top-1 after:grid after:-left-1 after:w-7 after:h-7 hover:bg-tint-active hover:text-current"><svg style="mask-image:url(https://ka-p.fontawesome.com/releases/v6.6.0/svgs/regular/chevron-right.svg?v=2&token=a463935e93);mask-repeat:no-repeat;mask-position:center" class="gb-icon grid flex-shrink-0 size-3 m-1 text-current transition-transform opacity-6 group-hover:opacity-11 contrast-more:opacity-11 rotate-0"></svg></span></a><div class="[&_ul>li]:opacity-1" style="opacity:0;height:0px;display:none"><ul class="flex flex-col gap-y-0.5 ml-5 my-2 border-tint-subtle sidebar-list-default:border-l sidebar-list-line:border-l"><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/makers/appx">AppX</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/makers/deb">deb</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/makers/dmg">DMG</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/makers/flatpak">Flatpak</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/makers/pkg">pkg</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/makers/rpm">RPM</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/makers/snapcraft">Snapcraft</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/makers/squirrel.windows">Squirrel.Windows</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/makers/wix-msi">WiX MSI</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/makers/zip">ZIP</a></li></ul></div></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/publishers">Publishers<span class="group relative rounded-full straight-corners:rounded-sm w-5 h-5 after:grid-area-1-1 after:absolute after:-top-1 after:grid after:-left-1 after:w-7 after:h-7 hover:bg-tint-active hover:text-current"><svg style="mask-image:url(https://ka-p.fontawesome.com/releases/v6.6.0/svgs/regular/chevron-right.svg?v=2&token=a463935e93);mask-repeat:no-repeat;mask-position:center" class="gb-icon grid flex-shrink-0 size-3 m-1 text-current transition-transform opacity-6 group-hover:opacity-11 contrast-more:opacity-11 rotate-0"></svg></span></a><div class="[&_ul>li]:opacity-1" style="opacity:0;height:0px;display:none"><ul class="flex flex-col gap-y-0.5 ml-5 my-2 border-tint-subtle sidebar-list-default:border-l sidebar-list-line:border-l"><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/publishers/bitbucket">Bitbucket</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/publishers/electron-release-server">Electron Release Server</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/publishers/github">GitHub</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/publishers/gcs">Google Cloud Storage</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/publishers/nucleus">Nucleus</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/publishers/s3">S3</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/publishers/snapcraft">Snapcraft</a></li></ul></div></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/config/hooks">Hooks</a></li></ul></li><li class="flex flex-col group/page-group-item"><div class="flex items-center gap-3 px-3 z-[1] sticky -top-5 pt-6 group-first/page-group-item:-mt-5 pb-3 -mb-1.5 text-xs tracking-wide font-semibold uppercase [mask-image:linear-gradient(rgba(0,0,0,1)_70%,rgba(0,0,0,0))] bg-tint-base sidebar-filled:bg-tint-subtle theme-muted:bg-tint-subtle theme-bold-tint:bg-tint-subtle [html.sidebar-filled.theme-muted_&]:bg-tint-base [html.sidebar-filled.theme-bold.tint_&]:bg-tint-base [html.sidebar-default.theme-gradient_&]:bg-gradient-primary [html.sidebar-default.theme-gradient.tint_&]:bg-gradient-tint">Built-in Templates</div><ul class="flex flex-col gap-y-0.5"><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/templates/webpack-template">Webpack</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/templates/typescript-+-webpack-template">Webpack + Typescript</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/templates/vite">Vite</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/templates/vite-+-typescript">Vite + TypeScript</a></li></ul></li><li class="flex flex-col group/page-group-item"><div class="flex items-center gap-3 px-3 z-[1] sticky -top-5 pt-6 group-first/page-group-item:-mt-5 pb-3 -mb-1.5 text-xs tracking-wide font-semibold uppercase [mask-image:linear-gradient(rgba(0,0,0,1)_70%,rgba(0,0,0,0))] bg-tint-base sidebar-filled:bg-tint-subtle theme-muted:bg-tint-subtle theme-bold-tint:bg-tint-subtle [html.sidebar-filled.theme-muted_&]:bg-tint-base [html.sidebar-filled.theme-bold.tint_&]:bg-tint-base [html.sidebar-default.theme-gradient_&]:bg-gradient-primary [html.sidebar-default.theme-gradient.tint_&]:bg-gradient-tint">Guides</div><ul class="flex flex-col gap-y-0.5"><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/guides/code-signing">Code Signing<span class="group relative rounded-full straight-corners:rounded-sm w-5 h-5 after:grid-area-1-1 after:absolute after:-top-1 after:grid after:-left-1 after:w-7 after:h-7 hover:bg-tint-active hover:text-current"><svg style="mask-image:url(https://ka-p.fontawesome.com/releases/v6.6.0/svgs/regular/chevron-right.svg?v=2&token=a463935e93);mask-repeat:no-repeat;mask-position:center" class="gb-icon grid flex-shrink-0 size-3 m-1 text-current transition-transform opacity-6 group-hover:opacity-11 contrast-more:opacity-11 rotate-0"></svg></span></a><div class="[&_ul>li]:opacity-1" style="opacity:0;height:0px;display:none"><ul class="flex flex-col gap-y-0.5 ml-5 my-2 border-tint-subtle sidebar-list-default:border-l sidebar-list-line:border-l"><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/guides/code-signing/code-signing-windows">Signing a Windows app</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/guides/code-signing/code-signing-macos">Signing a macOS app</a></li></ul></div></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/guides/create-and-add-icons">Custom App Icons</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/guides/framework-integration">Framework Integration<span class="group relative rounded-full straight-corners:rounded-sm w-5 h-5 after:grid-area-1-1 after:absolute after:-top-1 after:grid after:-left-1 after:w-7 after:h-7 hover:bg-tint-active hover:text-current"><svg style="mask-image:url(https://ka-p.fontawesome.com/releases/v6.6.0/svgs/regular/chevron-right.svg?v=2&token=a463935e93);mask-repeat:no-repeat;mask-position:center" class="gb-icon grid flex-shrink-0 size-3 m-1 text-current transition-transform opacity-6 group-hover:opacity-11 contrast-more:opacity-11 rotate-90"></svg></span></a><div class="" style="opacity:1;height:auto;display:block"><ul class="flex flex-col gap-y-0.5 ml-5 my-2 border-tint-subtle sidebar-list-default:border-l sidebar-list-line:border-l"><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/guides/framework-integration/react">React</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/guides/framework-integration/react-with-typescript">React with TypeScript</a></li><li class="flex flex-col"><a aria-current="page" class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm text-balance hover:contrast-more:ring-1 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none font-semibold sidebar-list-line:before:w-0.5 before:bg-primary-solid text-primary-subtle sidebar-list-pill:bg-primary [html.sidebar-list-pill.theme-muted_&]:bg-primary-hover [html.sidebar-list-pill.theme-bold.tint_&]:bg-primary-hover [html.sidebar-filled.sidebar-list-pill.theme-muted_&]:bg-primary [html.sidebar-filled.sidebar-list-pill.theme-bold.tint_&]:bg-primary hover:bg-primary-hover hover:text-primary hover:before:bg-primary-solid-hover sidebar-list-pill:hover:bg-primary-hover contrast-more:text-primary contrast-more:hover:text-primary-strong contrast-more:bg-primary contrast-more:ring-1 contrast-more:ring-primary contrast-more:hover:ring-primary-hover" href="/guides/framework-integration/vue-3">Vue 3</a></li></ul></div></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/guides/developing-with-wsl">Developing with WSL</a></li></ul></li><li class="flex flex-col group/page-group-item"><div class="flex items-center gap-3 px-3 z-[1] sticky -top-5 pt-6 group-first/page-group-item:-mt-5 pb-3 -mb-1.5 text-xs tracking-wide font-semibold uppercase [mask-image:linear-gradient(rgba(0,0,0,1)_70%,rgba(0,0,0,0))] bg-tint-base sidebar-filled:bg-tint-subtle theme-muted:bg-tint-subtle theme-bold-tint:bg-tint-subtle [html.sidebar-filled.theme-muted_&]:bg-tint-base [html.sidebar-filled.theme-bold.tint_&]:bg-tint-base [html.sidebar-default.theme-gradient_&]:bg-gradient-primary [html.sidebar-default.theme-gradient.tint_&]:bg-gradient-tint">Advanced</div><ul class="flex flex-col gap-y-0.5"><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/advanced/auto-update">Auto Update</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/advanced/debugging">Debugging</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/advanced/extending-electron-forge">Extending Electron Forge<span class="group relative rounded-full straight-corners:rounded-sm w-5 h-5 after:grid-area-1-1 after:absolute after:-top-1 after:grid after:-left-1 after:w-7 after:h-7 hover:bg-tint-active hover:text-current"><svg style="mask-image:url(https://ka-p.fontawesome.com/releases/v6.6.0/svgs/regular/chevron-right.svg?v=2&token=a463935e93);mask-repeat:no-repeat;mask-position:center" class="gb-icon grid flex-shrink-0 size-3 m-1 text-current transition-transform opacity-6 group-hover:opacity-11 contrast-more:opacity-11 rotate-0"></svg></span></a><div class="[&_ul>li]:opacity-1" style="opacity:0;height:0px;display:none"><ul class="flex flex-col gap-y-0.5 ml-5 my-2 border-tint-subtle sidebar-list-default:border-l sidebar-list-line:border-l"><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/advanced/extending-electron-forge/writing-plugins">Writing Plugins</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/advanced/extending-electron-forge/writing-templates">Writing Templates</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/advanced/extending-electron-forge/writing-makers">Writing Makers</a></li><li class="flex flex-col"><a class="group/toclink relative transition-colors flex flex-row justify-between p-1.5 pl-3 rounded-md straight-corners:rounded-none text-sm font-normal text-balance text-tint-strong/7 hover:text-tint-strong hover:bg-tint-hover contrast-more:text-tint-strong hover:contrast-more:text-tint-strong hover:contrast-more:ring-1 hover:contrast-more:ring-tint-12 before:contents[] before:absolute before:inset-y-0 before:-left-px [&+div_a]:pl-5 sidebar-list-line:before:w-px sidebar-list-default:[&+div_a]:before:w-px sidebar-list-default:[&+div_a]:rounded-l-none sidebar-list-line:rounded-l-none" href="/advanced/extending-electron-forge/writing-publishers">Writing Publishers</a></li></ul></div></li><li class="flex flex-col"><a class="flex justify-start items-center gap-3 p-1.5 pl-3 text-sm transition-colors duration-100 text-tint-strong/7 rounded-md straight-corners:rounded-none before:content-none font-normal hover:bg-tint hover:text-tint-strong" href="https://js.electronforge.io/modules/_electron_forge_core.html">API Docs<svg style="mask-image:url(https://ka-p.fontawesome.com/releases/v6.6.0/svgs/regular/arrow-up-right-from-square.svg?v=2&token=a463935e93);mask-repeat:no-repeat;mask-position:center" class="gb-icon size-3 mr-1 mt-1 place-self-start shrink-0 text-current transition-colors [&>path]:transition-[opacity] [&>path]:[opacity:0.40] group-hover:[&>path]:[opacity:1]"></svg></a></li></ul></li></ul><div class="relative z-[2] lg:absolute mt-6 left-0 right-2 bottom-0 pointer-events-none sidebar-filled:pl-2 sidebar-filled:pb-2 bg-tint-base sidebar-filled:bg-tint-subtle theme-muted:bg-tint-subtle [html.sidebar-filled.theme-muted_&]:bg-tint-base [html.sidebar-filled.theme-bold.tint_&]:bg-tint-base before:hidden lg:before:block before:content-[""] before:absolute before:inset-x-0 before:bottom-full before:h-8 before:bg-gradient-to-b before:from-transparent before:to-tint-base sidebar-filled:before:to-tint-subtle theme-muted:before:to-tint-subtle theme-bold-tint:before:to-tint-subtle [html.sidebar-filled.theme-muted_&]:before:to-tint-base [html.sidebar-filled.theme-bold.tint_&]:before:to-tint-base"><a target="_blank" class="text-sm font-semibold text-tint flex flex-row items-center px-5 py-4 sidebar-filled:px-3 rounded-lg straight-corners:rounded-none hover:bg-tint hover:text-tint-strong ring-2 lg:ring-1 ring-inset ring-tint-subtle transition-colors pointer-events-auto" href="https://www.gitbook.com/?utm_source=content&utm_medium=trademark&utm_campaign=-LBKK1y7h_XWAtuRJG9X-4037718589"><svg style="mask-image:url(https://static.gitbook.com/~gitbook/static/icons/svgs/custom-icons/gitbook.svg?v=2);mask-repeat:no-repeat;mask-position:center" class="gb-icon size-5 mr-3"></svg>Powered by GitBook</a></div></div></div></aside><div class="flex-1 flex flex-col"><div class="flex flex-row-reverse justify-end grow"><aside class="group/aside hidden xl:flex flex-col basis-56 grow-0 shrink-0 break-anywhere text-tint contrast-more:text-tint-strong sticky lg:top-0 lg:max-h-screen site-header:lg:top-16 site-header:lg:max-h-[calc(100vh_-_4rem)] site-header-sections:lg:top-[6.75rem] site-header-sections:lg:max-h-[calc(100vh_-_6.75rem)] page-api-block:xl:max-2xl:z-10 page-api-block:xl:max-2xl:fixed page-api-block:xl:max-2xl:right-8 page-api-block:xl:max-2xl:w-56 page-api-block:xl:max-2xl:bg-tint/9 page-api-block:xl:max-2xl:contrast-more:bg-tint page-api-block:xl:max-2xl:backdrop-blur-lg page-api-block:xl:max-2xl:border page-api-block:xl:max-2xl:border-tint page-api-block:xl:max-2xl:hover:shadow-lg page-api-block:xl:max-2xl:hover:shadow-tint-12/1 page-api-block:xl:max-2xl:dark:hover:shadow-tint-1/1 page-api-block:xl:max-2xl:rounded-md page-api-block:xl:max-2xl:h-auto page-api-block:xl:max-2xl:my-8 page-api-block:p-2"><div class="hidden page-api-block:xl:max-2xl:flex text-xs tracking-wide font-semibold uppercase flex-row items-center gap-2"><svg style="mask-image:url(https://ka-p.fontawesome.com/releases/v6.6.0/svgs/regular/block-quote.svg?v=2&token=a463935e93);mask-repeat:no-repeat;mask-position:center" class="gb-icon size-3"></svg>On this page<svg style="mask-image:url(https://ka-p.fontawesome.com/releases/v6.6.0/svgs/regular/chevron-down.svg?v=2&token=a463935e93);mask-repeat:no-repeat;mask-position:center" class="gb-icon size-3 opacity-6 ml-auto page-api-block:xl:max-2xl:group-hover/aside:hidden"></svg></div><div class="overflow-y-auto overflow-x-visible flex flex-col shrink pb-12 sticky lg:top:0 site-header:lg:top-16 site-header-sections:lg:top-[6.75rem] gap-6 pt-8 page-api-block:xl:max-2xl:py-0 page-api-block:xl:max-2xl:hidden page-api-block:xl:max-2xl:group-hover/aside:flex"><template id="B:0"></template><div class="flex flex-col gap-3 sidebar-list-default:px-3 border-t first:border-none border-tint-subtle py-4 first:pt-0 page-api-block:xl:max-2xl:px-3 empty:hidden"><div class="flex flex-col gap-3 text-sm mt-2"><div class="flex flex-wrap items-center gap-2"><p>Was this helpful?</p><div class="bg-tint-base border border-tint-subtle contrast-more:border-tint-12 rounded-full"><div class="flex"><button class="p-2 hover:bg-primary-hover hover:text-primary-strong first:pl-2.5 last:pr-2.5 first:rounded-l-full last:rounded-r-full disabled:cursor-not-allowed disabled:hover:bg-inherit disabled:hover:text-inherit disabled:dark:hover:text-inherit contrast-more:hover:ring-1 ring-tint disabled:opacity-7 disabled:contrast-more:ring-0" type="button" aria-label="No" title="No"><svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="9" cy="9" r="9" fill="currentColor" fill-opacity="0.2"></circle><path fill-rule="evenodd" clip-rule="evenodd" d="M5 8.25C4.58579 8.25 4.25 7.91421 4.25 7.5V6C4.25 5.58579 4.58579 5.25 5 5.25C5.41421 5.25 5.75 5.58579 5.75 6V7.5C5.75 7.91421 5.41421 8.25 5 8.25ZM4.66782 13.3737C4.87421 13.5572 5.19025 13.5386 5.3737 13.3322C7.30371 11.1609 10.6963 11.1609 12.6263 13.3322C12.8098 13.5386 13.1258 13.5572 13.3322 13.3737C13.5386 13.1902 13.5572 12.8742 13.3737 12.6678C11.0459 10.049 6.9541 10.049 4.6263 12.6678C4.44284 12.8742 4.46143 13.1902 4.66782 13.3737ZM12.25 7.5C12.25 7.91421 12.5858 8.25 13 8.25C13.4142 8.25 13.75 7.91421 13.75 7.5V6C13.75 5.58579 13.4142 5.25 13 5.25C12.5858 5.25 12.25 5.58579 12.25 6V7.5Z" fill="currentColor"></path></svg></button><button class="p-2 hover:bg-primary-hover hover:text-primary-strong first:pl-2.5 last:pr-2.5 first:rounded-l-full last:rounded-r-full disabled:cursor-not-allowed disabled:hover:bg-inherit disabled:hover:text-inherit disabled:dark:hover:text-inherit contrast-more:hover:ring-1 ring-tint disabled:opacity-7 disabled:contrast-more:ring-0" type="button" aria-label="Not sure" title="Not sure"><svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="9" cy="9" r="9" fill="currentColor" fill-opacity="0.2"></circle><path fill-rule="evenodd" clip-rule="evenodd" d="M5 8.25C4.58579 8.25 4.25 7.91421 4.25 7.5V6C4.25 5.58579 4.58579 5.25 5 5.25C5.41421 5.25 5.75 5.58579 5.75 6V7.5C5.75 7.91421 5.41421 8.25 5 8.25ZM4.5 12C4.5 11.7239 4.72386 11.5 5 11.5H13C13.2761 11.5 13.5 11.7239 13.5 12C13.5 12.2761 13.2761 12.5 13 12.5H5C4.72386 12.5 4.5 12.2761 4.5 12ZM12.25 7.5C12.25 7.91421 12.5858 8.25 13 8.25C13.4142 8.25 13.75 7.91421 13.75 7.5V6C13.75 5.58579 13.4142 5.25 13 5.25C12.5858 5.25 12.25 5.58579 12.25 6V7.5Z" fill="currentColor"></path></svg></button><button class="p-2 hover:bg-primary-hover hover:text-primary-strong first:pl-2.5 last:pr-2.5 first:rounded-l-full last:rounded-r-full disabled:cursor-not-allowed disabled:hover:bg-inherit disabled:hover:text-inherit disabled:dark:hover:text-inherit contrast-more:hover:ring-1 ring-tint disabled:opacity-7 disabled:contrast-more:ring-0" type="button" aria-label="Yes, it was!" title="Yes, it was!"><svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="9" cy="9" r="9" fill="currentColor" fill-opacity="0.2"></circle><path fill-rule="evenodd" clip-rule="evenodd" d="M5 8.25C4.58579 8.25 4.25 7.91421 4.25 7.5V6C4.25 5.58579 4.58579 5.25 5 5.25C5.41421 5.25 5.75 5.58579 5.75 6V7.5C5.75 7.91421 5.41421 8.25 5 8.25ZM4.66782 11.6263C4.87421 11.4428 5.19025 11.4614 5.3737 11.6678C7.30371 13.8391 10.6963 13.8391 12.6263 11.6678C12.8098 11.4614 13.1258 11.4428 13.3322 11.6263C13.5386 11.8098 13.5572 12.1258 13.3737 12.3322C11.0459 14.951 6.9541 14.951 4.6263 12.3322C4.44284 12.1258 4.46143 11.8098 4.66782 11.6263ZM12.25 7.5C12.25 7.91421 12.5858 8.25 13 8.25C13.4142 8.25 13.75 7.91421 13.75 7.5V6C13.75 5.58579 13.4142 5.25 13 5.25C12.5858 5.25 12.25 5.58579 12.25 6V7.5Z" fill="currentColor"></path></svg></button></div></div></div></div><div><a href="https://github.com/electron-forge/electron-forge-docs/blob/v6/guides/framework-integration/vue-3.md" class="flex flex-row items-center text-sm hover:text-tint-strong py-2"><svg style="mask-image:url(https://ka-p.fontawesome.com/releases/v6.6.0/svgs/brands/github.svg?v=2&token=a463935e93);mask-repeat:no-repeat;mask-position:center" class="gb-icon size-4 mr-1.5"></svg>Edit on GitHub</a></div></div></div><div class="pb-4 sticky bottom-0 bg-tint-base theme-muted:bg-tint-subtle theme-bold-tint:bg-tint-subtle theme-gradient:bg-gradient-primary theme-gradient-tint:bg-gradient-tint z-10 mt-auto flex flex-col page-api-block:xl:max-2xl:pb-0 page-api-block:xl:max-2xl:hidden page-api-block:xl:max-2xl:group-hover/aside:flex page-api-block:xl:max-2xl:bg-transparent"><div class="flex items-center justify-end mt-4"><div role="radiogroup" class="flex flex-row gap-2"><button type="button" role="radio" aria-label="Switch to light theme" title="Switch to light theme" aria-checked="false" class="p-2 rounded straight-corners:rounded-none transition-all text-tint contrast-more:text-tint-strong hover:bg-tint-hover contrast-more:hover:ring-2 contrast-more:focus:ring-2 ring-tint"><svg style="mask-image:url(https://ka-p.fontawesome.com/releases/v6.6.0/svgs/regular/sun-bright.svg?v=2&token=a463935e93);mask-repeat:no-repeat;mask-position:center" class="gb-icon size-4"></svg></button><button type="button" role="radio" aria-label="Switch to system theme" title="Switch to system theme" aria-checked="false" class="p-2 rounded straight-corners:rounded-none transition-all text-tint contrast-more:text-tint-strong hover:bg-tint-hover contrast-more:hover:ring-2 contrast-more:focus:ring-2 ring-tint"><svg style="mask-image:url(https://ka-p.fontawesome.com/releases/v6.6.0/svgs/regular/desktop.svg?v=2&token=a463935e93);mask-repeat:no-repeat;mask-position:center" class="gb-icon size-4"></svg></button><button type="button" role="radio" aria-label="Switch to dark theme" title="Switch to dark theme" aria-checked="false" class="p-2 rounded straight-corners:rounded-none transition-all text-tint contrast-more:text-tint-strong hover:bg-tint-hover contrast-more:hover:ring-2 contrast-more:focus:ring-2 ring-tint"><svg style="mask-image:url(https://ka-p.fontawesome.com/releases/v6.6.0/svgs/regular/moon.svg?v=2&token=a463935e93);mask-repeat:no-repeat;mask-position:center" class="gb-icon size-4"></svg></button></div></div><div class="" data-visual-test="removed"></div></div></aside><main class="flex-1 relative py-8 lg:px-12 break-anywhere page-api-block:xl:max-2xl:pr-0 page-api-block:max-w-[1654px] page-api-block:mx-auto"><header class="max-w-3xl mx-auto mb-6 space-y-3 page-api-block:ml-0"><nav><ol class="flex flex-wrap items-center gap-2"><li><a class="underline-offset-2 decoration-primary/6 text-primary-subtle hover:text-primary contrast-more:text-primary contrast-more:hover:text-primary-strong transition-colors no-underline hover:underline text-xs tracking-wide font-semibold uppercase flex items-center gap-1.5 contrast-more:underline contrast-more:decoration-current" href="/guides">Guides</a></li><svg style="mask-image:url(https://ka-p.fontawesome.com/releases/v6.6.0/svgs/regular/chevron-right.svg?v=2&token=a463935e93);mask-repeat:no-repeat;mask-position:center" class="gb-icon size-3 text-tint-subtle"></svg><li><a class="underline-offset-2 decoration-primary/6 text-primary-subtle hover:text-primary contrast-more:text-primary contrast-more:hover:text-primary-strong transition-colors no-underline hover:underline text-xs tracking-wide font-semibold uppercase flex items-center gap-1.5 contrast-more:underline contrast-more:decoration-current" href="/guides/framework-integration">Framework Integration</a></li></ol></nav><h1 class="text-4xl font-bold flex items-center gap-4">Vue 3</h1><p class="text-lg text-tint">How to create an Electron app with Vue and Electron Forge</p></header><div class="[&>*+*]:mt-5 grid whitespace-pre-wrap"><p class="w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0">Vue 3 can be added to Electron Forge's Vite template with a few setup steps.</p><div class="hint p-4 transition-colors rounded-md straight-corners:rounded-none bg-tint print-mode:!bg-tint theme-muted:bg-tint-base theme-bold-tint:bg-tint-base theme-gradient:bg-tint-12/1 border-tint [&_.can-override-bg]:bg-tint-active [&_.can-override-text]:text-tint-strong w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0"><div class="flex flex-row"><svg style="mask-image:url(https://ka-p.fontawesome.com/releases/v6.6.0/svgs/regular/circle-info.svg?v=2&token=a463935e93);mask-repeat:no-repeat;mask-position:center" class="gb-icon size-5 mr-4 mt-0.5 leading-normal text-primary"></svg><div class="flex-1 space-y-4 [&_.hint]:border [&_pre]:border"><p class="w-full mx-auto decoration-primary/6 max-w-3xl [&_a]:text-primary [&_a:hover]:text-primary-strong flip-heading-hash">The following guide has been tested with Vue 3 and Vite 4.</p></div></div></div><h2 id="setting-up-the-app" class="text-3xl font-semibold heading group relative grid w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0"><div class="grid grid-area-1-1 relative -ml-6 w-7 border-0 opacity-0 group-hover:opacity-[0] group-focus:opacity-[0] md:group-hover:md:opacity-[1] md:group-focus:md:opacity-[1] mt-[1em]"><a href="#setting-up-the-app" aria-label="Direct link to heading" class="inline-flex h-full items-start dark:shadow-none dark:ring-0 leading-tight"><svg style="mask-image:url(https://ka-p.fontawesome.com/releases/v6.6.0/svgs/regular/hashtag.svg?v=2&token=a463935e93);mask-repeat:no-repeat;mask-position:center" class="gb-icon w-3.5 h-[1lh] transition-colors text-transparent group-hover:text-tint-subtle contrast-more:group-hover:text-tint-strong lg:w-4"></svg></a></div><div class="grid-area-1-1 z-[1] justify-self-start text-left leading-tight mt-[1em]">Setting up the app</div></h2><p class="w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0">Create an Electron app using Electron Forge's <a class="underline underline-offset-2 text-primary-subtle hover:text-primary contrast-more:text-primary contrast-more:hover:text-primary-strong transition-colors" href="/templates/vite">Vite</a> template.</p><div class="group/codeblock grid grid-flow-col w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0"><div class="flex items-center justify-start [grid-area:1/1] text-sm gap-2"></div><button class="group-hover/codeblock:opacity-[1] transition-opacity duration-75 opacity-0 text-xs [grid-area:2/1] z-[2] justify-self-end backdrop-blur-md leading-none self-start ring-1 ring-tint text-tint bg-transparent rounded-md mr-2 mt-2 p-1 hover:ring-tint-hover print:hidden">Copy</button><pre class="[grid-area:2/1] relative overflow-auto bg-tint theme-gradient:bg-tint-12/1 ring-tint-subtle hide-scroll rounded-md straight-corners:rounded-sm"><code id=":R1cd9uu8qfkvfa:" class="min-w-full inline-grid grid-cols-[auto_1fr] p-2 [count-reset:line]"><span class="highlight-line"><span class="highlight-line-content">npx create-electron-app@latest my-vue-app --template=vite</span></span></code></pre></div><h2 id="adding-dependencies" class="text-3xl font-semibold heading group relative grid w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0"><div class="grid grid-area-1-1 relative -ml-6 w-7 border-0 opacity-0 group-hover:opacity-[0] group-focus:opacity-[0] md:group-hover:md:opacity-[1] md:group-focus:md:opacity-[1] mt-[1em]"><a href="#adding-dependencies" aria-label="Direct link to heading" class="inline-flex h-full items-start dark:shadow-none dark:ring-0 leading-tight"><svg style="mask-image:url(https://ka-p.fontawesome.com/releases/v6.6.0/svgs/regular/hashtag.svg?v=2&token=a463935e93);mask-repeat:no-repeat;mask-position:center" class="gb-icon w-3.5 h-[1lh] transition-colors text-transparent group-hover:text-tint-subtle contrast-more:group-hover:text-tint-strong lg:w-4"></svg></a></div><div class="grid-area-1-1 z-[1] justify-self-start text-left leading-tight mt-[1em]">Adding dependencies</div></h2><p class="w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0">Add the <code class="py-[1px] px-1.5 min-w-[1.625rem] justify-center items-center ring-1 ring-inset ring-tint bg-tint rounded text-[.875em] leading-[calc(max(1.20em,1.25rem))]">vue</code> npm package to your <code class="py-[1px] px-1.5 min-w-[1.625rem] justify-center items-center ring-1 ring-inset ring-tint bg-tint rounded text-[.875em] leading-[calc(max(1.20em,1.25rem))]">dependencies</code> and the <code class="py-[1px] px-1.5 min-w-[1.625rem] justify-center items-center ring-1 ring-inset ring-tint bg-tint rounded text-[.875em] leading-[calc(max(1.20em,1.25rem))]">@vitejs/plugin-vue</code> package to your <code class="py-[1px] px-1.5 min-w-[1.625rem] justify-center items-center ring-1 ring-inset ring-tint bg-tint rounded text-[.875em] leading-[calc(max(1.20em,1.25rem))]">devDependencies</code>:</p><div class="group/codeblock grid grid-flow-col w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0"><div class="flex items-center justify-start [grid-area:1/1] text-sm gap-2"></div><button class="group-hover/codeblock:opacity-[1] transition-opacity duration-75 opacity-0 text-xs [grid-area:2/1] z-[2] justify-self-end backdrop-blur-md leading-none self-start ring-1 ring-tint text-tint bg-transparent rounded-md mr-2 mt-2 p-1 hover:ring-tint-hover print:hidden">Copy</button><pre class="[grid-area:2/1] relative overflow-auto bg-tint theme-gradient:bg-tint-12/1 ring-tint-subtle hide-scroll rounded-md straight-corners:rounded-sm"><code id=":R24d9uu8qfkvfa:" class="min-w-full inline-grid grid-cols-[auto_1fr] p-2 [count-reset:line]"><span class="highlight-line"><span class="highlight-line-content">npm install vue </span></span><span class="highlight-line"><span class="highlight-line-content">npm install --save-dev @vitejs/plugin-vue</span></span></code></pre></div><h2 id="integrating-vue-3-code" class="text-3xl font-semibold heading group relative grid w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0"><div class="grid grid-area-1-1 relative -ml-6 w-7 border-0 opacity-0 group-hover:opacity-[0] group-focus:opacity-[0] md:group-hover:md:opacity-[1] md:group-focus:md:opacity-[1] mt-[1em]"><a href="#integrating-vue-3-code" aria-label="Direct link to heading" class="inline-flex h-full items-start dark:shadow-none dark:ring-0 leading-tight"><svg style="mask-image:url(https://ka-p.fontawesome.com/releases/v6.6.0/svgs/regular/hashtag.svg?v=2&token=a463935e93);mask-repeat:no-repeat;mask-position:center" class="gb-icon w-3.5 h-[1lh] transition-colors text-transparent group-hover:text-tint-subtle contrast-more:group-hover:text-tint-strong lg:w-4"></svg></a></div><div class="grid-area-1-1 z-[1] justify-self-start text-left leading-tight mt-[1em]">Integrating Vue 3 code</div></h2><p class="w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0">You should now be able to start using Vue components in your Electron app. The following is a very minimal example of how to start to add Vue 3 code:</p><div class="rounded-lg straight-corners:rounded-sm ring-1 ring-inset ring-tint-subtle flex overflow-hidden flex-col w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0"><div role="tablist" class="group/tabs inline-flex flex-row self-stretch after:flex-[1] after:bg-tint-12/1 [&:has(button.active-tab:last-of-type):after]:rounded-bl-md"><button role="tab" aria-selected="true" aria-controls="src-index.html" id="tab-src-index.html" class="[&:has(+_.active-tab)]:rounded-br-md [.active-tab_+_&]:rounded-bl-md [.active-tab_+_:after]:rounded-br-md inline-block text-sm px-3.5 py-2 transition-[color] font-[500] relative after:transition-colors after:border-r after:absolute after:left-[unset] after:right-0 after:border-tint after:top-[15%] after:h-[70%] after:w-[1px] last:after:border-transparent hover:text-tint-strong truncate max-w-full shrink-0 active-tab text-tint-strong bg-transparent after:[&.active-tab]:border-transparent after:[:has(+_&.active-tab)]:border-transparent after:[:has(&_+)]:border-transparent">src/index.html</button><button role="tab" aria-selected="false" aria-controls="src-app.vue" id="tab-src-app.vue" class="[&:has(+_.active-tab)]:rounded-br-md [.active-tab_+_&]:rounded-bl-md [.active-tab_+_:after]:rounded-br-md inline-block text-sm px-3.5 py-2 transition-[color] font-[500] relative after:transition-colors after:border-r after:absolute after:left-[unset] after:right-0 after:border-tint after:top-[15%] after:h-[70%] after:w-[1px] last:after:border-transparent text-tint bg-tint-12/1 hover:text-tint-strong truncate max-w-full">src/App.vue</button><button role="tab" aria-selected="false" aria-controls="src-renderer.js" id="tab-src-renderer.js" class="[&:has(+_.active-tab)]:rounded-br-md [.active-tab_+_&]:rounded-bl-md [.active-tab_+_:after]:rounded-br-md inline-block text-sm px-3.5 py-2 transition-[color] font-[500] relative after:transition-colors after:border-r after:absolute after:left-[unset] after:right-0 after:border-tint after:top-[15%] after:h-[70%] after:w-[1px] last:after:border-transparent text-tint bg-tint-12/1 hover:text-tint-strong truncate max-w-full">src/renderer.js</button><button role="tab" aria-selected="false" aria-controls="vite.renderer.config.mjs" id="tab-vite.renderer.config.mjs" class="[&:has(+_.active-tab)]:rounded-br-md [.active-tab_+_&]:rounded-bl-md [.active-tab_+_:after]:rounded-br-md inline-block text-sm px-3.5 py-2 transition-[color] font-[500] relative after:transition-colors after:border-r after:absolute after:left-[unset] after:right-0 after:border-tint after:top-[15%] after:h-[70%] after:w-[1px] last:after:border-transparent text-tint bg-tint-12/1 hover:text-tint-strong truncate max-w-full">vite.renderer.config.mjs</button></div><div role="tabpanel" id="src-index.html" aria-labelledby="tab-src-index.html" class="p-4"><div class="w-full space-y-4"><p class="w-full mx-auto decoration-primary/6 max-w-3xl flip-heading-hash">Replace the contents of <code class="py-[1px] px-1.5 min-w-[1.625rem] justify-center items-center ring-1 ring-inset ring-tint bg-tint rounded text-[.875em] leading-[calc(max(1.20em,1.25rem))]">src/index.html</code> with a <code class="py-[1px] px-1.5 min-w-[1.625rem] justify-center items-center ring-1 ring-inset ring-tint bg-tint rounded text-[.875em] leading-[calc(max(1.20em,1.25rem))]"><div></code> element with the <code class="py-[1px] px-1.5 min-w-[1.625rem] justify-center items-center ring-1 ring-inset ring-tint bg-tint rounded text-[.875em] leading-[calc(max(1.20em,1.25rem))]">#app</code> id attribute.</p><div class="group/codeblock grid grid-flow-col w-full mx-auto decoration-primary/6 max-w-3xl flip-heading-hash"><div class="flex items-center justify-start [grid-area:1/1] text-sm gap-2"></div><button class="group-hover/codeblock:opacity-[1] transition-opacity duration-75 opacity-0 text-xs [grid-area:2/1] z-[2] justify-self-end backdrop-blur-md leading-none self-start ring-1 ring-tint text-tint bg-transparent rounded-md mr-2 mt-2 p-1 hover:ring-tint-hover print:hidden">Copy</button><pre class="[grid-area:2/1] relative overflow-auto bg-tint theme-gradient:bg-tint-12/1 ring-tint-subtle hide-scroll rounded-md straight-corners:rounded-sm"><code id=":R8qsd9uu8qfkvfa:" class="min-w-full inline-grid grid-cols-[auto_1fr] p-2 [count-reset:line]"><span class="highlight-line"><span class="highlight-line-content"><!DOCTYPE html> </span></span><span class="highlight-line"><span class="highlight-line-content"><html> </span></span><span class="highlight-line"><span class="highlight-line-content"> <head> </span></span><span class="highlight-line"><span class="highlight-line-content"> <meta charset="UTF-8" /> </span></span><span class="highlight-line"><span class="highlight-line-content"> <title>Hello World!</title> </span></span><span class="highlight-line"><span class="highlight-line-content"> </head> </span></span><span class="highlight-line"><span class="highlight-line-content"> <body> </span></span><span class="highlight-line"><span class="highlight-line-content"> <div id="app"></div> </span></span><span class="highlight-line"><span class="highlight-line-content"> <script type="module" src="/src/renderer.js"></script> </span></span><span class="highlight-line"><span class="highlight-line-content"> </body> </span></span><span class="highlight-line"><span class="highlight-line-content"></html></span></span></code></pre></div></div></div><div role="tabpanel" id="src-app.vue" aria-labelledby="tab-src-app.vue" class="p-4 hidden"><div class="w-full space-y-4"><p class="w-full mx-auto decoration-primary/6 max-w-3xl flip-heading-hash">Add the contents from the template back to <code class="py-[1px] px-1.5 min-w-[1.625rem] justify-center items-center ring-1 ring-inset ring-tint bg-tint rounded text-[.875em] leading-[calc(max(1.20em,1.25rem))]">src/App.vue</code>.</p><div class="group/codeblock grid grid-flow-col w-full mx-auto decoration-primary/6 max-w-3xl flip-heading-hash"><div class="flex items-center justify-start [grid-area:1/1] text-sm gap-2"></div><button class="group-hover/codeblock:opacity-[1] transition-opacity duration-75 opacity-0 text-xs [grid-area:2/1] z-[2] justify-self-end backdrop-blur-md leading-none self-start ring-1 ring-tint text-tint bg-transparent rounded-md mr-2 mt-2 p-1 hover:ring-tint-hover print:hidden">Copy</button><pre class="[grid-area:2/1] relative overflow-auto bg-tint theme-gradient:bg-tint-12/1 ring-tint-subtle hide-scroll rounded-md straight-corners:rounded-sm"><code id=":R9asd9uu8qfkvfa:" class="min-w-full inline-grid grid-cols-[auto_1fr] p-2 [count-reset:line]"><span class="highlight-line"><span class="highlight-line-content"><template> </span></span><span class="highlight-line"><span class="highlight-line-content"> <h1>馃挅 Hello World!</h1> </span></span><span class="highlight-line"><span class="highlight-line-content"> <p>Welcome to your Electron application.</p> </span></span><span class="highlight-line"><span class="highlight-line-content"></template> </span></span><span class="highlight-line"><span class="highlight-line-content"> </span></span><span class="highlight-line"><span class="highlight-line-content"><script setup> </span></span><span class="highlight-line"><span class="highlight-line-content">console.log('馃憢 This message is being logged by "App.vue", included via Vite'); </span></span><span class="highlight-line"><span class="highlight-line-content"></script></span></span></code></pre></div></div></div><div role="tabpanel" id="src-renderer.js" aria-labelledby="tab-src-renderer.js" class="p-4 hidden"><div class="w-full space-y-4"><p class="w-full mx-auto decoration-primary/6 max-w-3xl flip-heading-hash">Mount <code class="py-[1px] px-1.5 min-w-[1.625rem] justify-center items-center ring-1 ring-inset ring-tint bg-tint rounded text-[.875em] leading-[calc(max(1.20em,1.25rem))]">App.vue</code> into the DOM with Vue's <code class="py-[1px] px-1.5 min-w-[1.625rem] justify-center items-center ring-1 ring-inset ring-tint bg-tint rounded text-[.875em] leading-[calc(max(1.20em,1.25rem))]">createApp</code> API.</p><div class="group/codeblock grid grid-flow-col w-full mx-auto decoration-primary/6 max-w-3xl flip-heading-hash"><div class="flex items-center justify-start [grid-area:1/1] text-sm gap-2"></div><button class="group-hover/codeblock:opacity-[1] transition-opacity duration-75 opacity-0 text-xs [grid-area:2/1] z-[2] justify-self-end backdrop-blur-md leading-none self-start ring-1 ring-tint text-tint bg-transparent rounded-md mr-2 mt-2 p-1 hover:ring-tint-hover print:hidden">Copy</button><pre class="[grid-area:2/1] relative overflow-auto bg-tint theme-gradient:bg-tint-12/1 ring-tint-subtle hide-scroll rounded-md straight-corners:rounded-sm"><code id=":R9qsd9uu8qfkvfa:" class="min-w-full inline-grid grid-cols-[auto_1fr] p-2 [count-reset:line]"><span class="highlight-line"><span class="highlight-line-content">import { createApp } from 'vue'; </span></span><span class="highlight-line"><span class="highlight-line-content">import App from './App.vue'; </span></span><span class="highlight-line"><span class="highlight-line-content"> </span></span><span class="highlight-line"><span class="highlight-line-content">createApp(App).mount('#app');</span></span></code></pre></div></div></div><div role="tabpanel" id="vite.renderer.config.mjs" aria-labelledby="tab-vite.renderer.config.mjs" class="p-4 hidden"><div class="w-full space-y-4"><p class="w-full mx-auto decoration-primary/6 max-w-3xl flip-heading-hash">Configure the Vue plugin for Vite.js.</p><div class="group/codeblock grid grid-flow-col w-full mx-auto decoration-primary/6 max-w-3xl flip-heading-hash"><div class="flex items-center justify-start [grid-area:1/1] text-sm gap-2"></div><button class="group-hover/codeblock:opacity-[1] transition-opacity duration-75 opacity-0 text-xs [grid-area:2/1] z-[2] justify-self-end backdrop-blur-md leading-none self-start ring-1 ring-tint text-tint bg-transparent rounded-md mr-2 mt-2 p-1 hover:ring-tint-hover print:hidden">Copy</button><pre class="[grid-area:2/1] relative overflow-auto bg-tint theme-gradient:bg-tint-12/1 ring-tint-subtle hide-scroll rounded-md straight-corners:rounded-sm"><code id=":Raasd9uu8qfkvfa:" class="min-w-full inline-grid grid-cols-[auto_1fr] p-2 [count-reset:line]"><span class="highlight-line"><span class="highlight-line-content">import { defineConfig } from 'vite'; </span></span><span class="highlight-line"><span class="highlight-line-content">import vue from '@vitejs/plugin-vue'; </span></span><span class="highlight-line"><span class="highlight-line-content"> </span></span><span class="highlight-line"><span class="highlight-line-content">// https://vitejs.dev/config </span></span><span class="highlight-line"><span class="highlight-line-content">export default defineConfig({ </span></span><span class="highlight-line"><span class="highlight-line-content"> plugins: [vue()] </span></span><span class="highlight-line"><span class="highlight-line-content">});</span></span></code></pre></div></div></div></div></div><div class="flex flex-col md:flex-row mt-6 gap-2 max-w-3xl mx-auto page-api-block:ml-0 text-tint"><a class="group text-sm p-2.5 flex gap-4 flex-1 flex-row-reverse items-center pl-4 border border-tint-subtle rounded straight-corners:rounded-none hover:border-primary text-pretty md:p-4 md:text-base" href="/guides/framework-integration/react-with-typescript"><span class="flex flex-col flex-1 text-right"><span class="text-xs">Previous</span><span class="text-tint-strong group-hover:text-primary line-clamp-2">React with TypeScript</span></span><svg style="mask-image:url(https://ka-p.fontawesome.com/releases/v6.6.0/svgs/regular/chevron-left.svg?v=2&token=a463935e93);mask-repeat:no-repeat;mask-position:center" class="gb-icon hidden size-4 text-tint-subtle contrast-more:text-tint-strong group-hover:text-primary md:block"></svg></a><a class="group text-sm p-2.5 flex gap-4 flex-1 flex-row items-center pr-4 border border-tint-subtle rounded straight-corners:rounded-none hover:border-primary text-pretty md:p-4 md:text-base" href="/guides/developing-with-wsl"><span class="flex flex-col flex-1"><span class="text-xs">Next</span><span class="text-tint-strong group-hover:text-primary line-clamp-2">Developing with WSL</span></span><svg style="mask-image:url(https://ka-p.fontawesome.com/releases/v6.6.0/svgs/regular/chevron-right.svg?v=2&token=a463935e93);mask-repeat:no-repeat;mask-position:center" class="gb-icon hidden size-4 text-tint-subtle contrast-more:text-tint-strong group-hover:text-primary md:block"></svg></a></div><div class="flex flex-row flex-wrap gap-4 items-center mt-6 max-w-3xl mx-auto page-api-block:ml-0 text-tint contrast-more:text-tint-strong"><p class="text-sm mr-auto">Last updated <time data-visual-test="transparent" dateTime="2024-12-11T18:53:45.545Z" title="12/11/2024, 6:53:45 PM">2 months ago</time></p><div class="flex flex-col gap-3 text-sm xl:hidden"><div class="flex flex-wrap items-center gap-2"><p>Was this helpful?</p><div class="bg-tint-base border border-tint-subtle contrast-more:border-tint-12 rounded-full"><div class="flex"><button class="p-2 hover:bg-primary-hover hover:text-primary-strong first:pl-2.5 last:pr-2.5 first:rounded-l-full last:rounded-r-full disabled:cursor-not-allowed disabled:hover:bg-inherit disabled:hover:text-inherit disabled:dark:hover:text-inherit contrast-more:hover:ring-1 ring-tint disabled:opacity-7 disabled:contrast-more:ring-0" type="button" aria-label="No" title="No"><svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="9" cy="9" r="9" fill="currentColor" fill-opacity="0.2"></circle><path fill-rule="evenodd" clip-rule="evenodd" d="M5 8.25C4.58579 8.25 4.25 7.91421 4.25 7.5V6C4.25 5.58579 4.58579 5.25 5 5.25C5.41421 5.25 5.75 5.58579 5.75 6V7.5C5.75 7.91421 5.41421 8.25 5 8.25ZM4.66782 13.3737C4.87421 13.5572 5.19025 13.5386 5.3737 13.3322C7.30371 11.1609 10.6963 11.1609 12.6263 13.3322C12.8098 13.5386 13.1258 13.5572 13.3322 13.3737C13.5386 13.1902 13.5572 12.8742 13.3737 12.6678C11.0459 10.049 6.9541 10.049 4.6263 12.6678C4.44284 12.8742 4.46143 13.1902 4.66782 13.3737ZM12.25 7.5C12.25 7.91421 12.5858 8.25 13 8.25C13.4142 8.25 13.75 7.91421 13.75 7.5V6C13.75 5.58579 13.4142 5.25 13 5.25C12.5858 5.25 12.25 5.58579 12.25 6V7.5Z" fill="currentColor"></path></svg></button><button class="p-2 hover:bg-primary-hover hover:text-primary-strong first:pl-2.5 last:pr-2.5 first:rounded-l-full last:rounded-r-full disabled:cursor-not-allowed disabled:hover:bg-inherit disabled:hover:text-inherit disabled:dark:hover:text-inherit contrast-more:hover:ring-1 ring-tint disabled:opacity-7 disabled:contrast-more:ring-0" type="button" aria-label="Not sure" title="Not sure"><svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="9" cy="9" r="9" fill="currentColor" fill-opacity="0.2"></circle><path fill-rule="evenodd" clip-rule="evenodd" d="M5 8.25C4.58579 8.25 4.25 7.91421 4.25 7.5V6C4.25 5.58579 4.58579 5.25 5 5.25C5.41421 5.25 5.75 5.58579 5.75 6V7.5C5.75 7.91421 5.41421 8.25 5 8.25ZM4.5 12C4.5 11.7239 4.72386 11.5 5 11.5H13C13.2761 11.5 13.5 11.7239 13.5 12C13.5 12.2761 13.2761 12.5 13 12.5H5C4.72386 12.5 4.5 12.2761 4.5 12ZM12.25 7.5C12.25 7.91421 12.5858 8.25 13 8.25C13.4142 8.25 13.75 7.91421 13.75 7.5V6C13.75 5.58579 13.4142 5.25 13 5.25C12.5858 5.25 12.25 5.58579 12.25 6V7.5Z" fill="currentColor"></path></svg></button><button class="p-2 hover:bg-primary-hover hover:text-primary-strong first:pl-2.5 last:pr-2.5 first:rounded-l-full last:rounded-r-full disabled:cursor-not-allowed disabled:hover:bg-inherit disabled:hover:text-inherit disabled:dark:hover:text-inherit contrast-more:hover:ring-1 ring-tint disabled:opacity-7 disabled:contrast-more:ring-0" type="button" aria-label="Yes, it was!" title="Yes, it was!"><svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="9" cy="9" r="9" fill="currentColor" fill-opacity="0.2"></circle><path fill-rule="evenodd" clip-rule="evenodd" d="M5 8.25C4.58579 8.25 4.25 7.91421 4.25 7.5V6C4.25 5.58579 4.58579 5.25 5 5.25C5.41421 5.25 5.75 5.58579 5.75 6V7.5C5.75 7.91421 5.41421 8.25 5 8.25ZM4.66782 11.6263C4.87421 11.4428 5.19025 11.4614 5.3737 11.6678C7.30371 13.8391 10.6963 13.8391 12.6263 11.6678C12.8098 11.4614 13.1258 11.4428 13.3322 11.6263C13.5386 11.8098 13.5572 12.1258 13.3737 12.3322C11.0459 14.951 6.9541 14.951 4.6263 12.3322C4.44284 12.1258 4.46143 11.8098 4.66782 11.6263ZM12.25 7.5C12.25 7.91421 12.5858 8.25 13 8.25C13.4142 8.25 13.75 7.91421 13.75 7.5V6C13.75 5.58579 13.4142 5.25 13 5.25C12.5858 5.25 12.25 5.58579 12.25 6V7.5Z" fill="currentColor"></path></svg></button></div></div></div></div></div></main></div></div></div><hr class="border-t border-tint-subtle"/><div class="scroll-nojump"><footer class="sm:px-6 md:px-8 max-w-screen-2xl page-full-width:max-w-full px-4 mx-auto flex gap-12 xl:hidden"><div class="hidden lg:block basis-72 page-no-toc:hidden"></div><div class="py-8 gap-12 flex flex-wrap items-start w-full flex-1 max-w-3xl page-full-width:max-w-none mx-auto"><div class="flex items-center justify-end ml-auto order-2 xl:hidden"><div role="radiogroup" class="flex flex-row gap-2"><button type="button" role="radio" aria-label="Switch to light theme" title="Switch to light theme" aria-checked="false" class="p-2 rounded straight-corners:rounded-none transition-all text-tint contrast-more:text-tint-strong hover:bg-tint-hover contrast-more:hover:ring-2 contrast-more:focus:ring-2 ring-tint"><svg style="mask-image:url(https://ka-p.fontawesome.com/releases/v6.6.0/svgs/regular/sun-bright.svg?v=2&token=a463935e93);mask-repeat:no-repeat;mask-position:center" class="gb-icon size-4"></svg></button><button type="button" role="radio" aria-label="Switch to system theme" title="Switch to system theme" aria-checked="false" class="p-2 rounded straight-corners:rounded-none transition-all text-tint contrast-more:text-tint-strong hover:bg-tint-hover contrast-more:hover:ring-2 contrast-more:focus:ring-2 ring-tint"><svg style="mask-image:url(https://ka-p.fontawesome.com/releases/v6.6.0/svgs/regular/desktop.svg?v=2&token=a463935e93);mask-repeat:no-repeat;mask-position:center" class="gb-icon size-4"></svg></button><button type="button" role="radio" aria-label="Switch to dark theme" title="Switch to dark theme" aria-checked="false" class="p-2 rounded straight-corners:rounded-none transition-all text-tint contrast-more:text-tint-strong hover:bg-tint-hover contrast-more:hover:ring-2 contrast-more:focus:ring-2 ring-tint"><svg style="mask-image:url(https://ka-p.fontawesome.com/releases/v6.6.0/svgs/regular/moon.svg?v=2&token=a463935e93);mask-repeat:no-repeat;mask-position:center" class="gb-icon size-4"></svg></button></div></div><div class="mx-auto w-full grow text-xs text-tint items-center text-center order-4 flex flex-col gap-2 empty:hidden sm:order-1 sm:flex-1 sm:w-auto sm:items-start sm:max-w-3xl self-center sm:text-start"></div></div><div class="hidden lg:block xl:basis-56 page-no-toc:hidden"></div></footer></div><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx" data-cfasync="false"> document.addEventListener("DOMContentLoaded", () => { if (Array.from(document.scripts).find(script => script.src.includes('rocket-loader.min.js'))) { const alert = document.createElement('div'); alert.className = 'p-4 mb-4 text-sm text-red-800 rounded-lg bg-red-50 mt-8 mx-8'; alert.innerHTML = ` <strong>Error in site configuration:</strong> It looks like ${window.location.hostname} has been incorrectly configured in Cloudflare. This may lead to unexpected behavior or issues with the page loading. If you are the owner of this site, please refer to <a href="https://docs.gitbook.com/published-documentation/custom-domain/configure-dns#are-you-using-cloudflare" class="underline">GitBook's documentation</a> for steps to fix the problem. `; document.body.prepend(alert); } });</script><script src="https://static.gitbook.com/_next/static/chunks/webpack-ff813e9d416ce230.js" nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx" async=""></script><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">(self.__next_f=self.__next_f||[]).push([0]);self.__next_f.push([2,null])</script><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">self.__next_f.push([1,"1:HC[\"https://static.gitbook.com\",\"\"]\n2:HL[\"https://static.gitbook.com/_next/static/css/9f5478b23a2dbc0b.css\",\"style\"]\n3:HL[\"https://static.gitbook.com/_next/static/css/c689b5a6a1432db7.css\",\"style\"]\n4:HL[\"https://static.gitbook.com/_next/static/css/619939f8b811f942.css\",\"style\"]\n5:HL[\"https://static.gitbook.com/_next/static/css/95b358fb5c9305a3.css\",\"style\"]\n6:HL[\"https://static.gitbook.com/_next/static/css/09a5087aafb66ce5.css\",\"style\"]\n7:HL[\"https://static.gitbook.com/_next/static/css/faa0908d2237c5e3.css\",\"style\"]\n8:HL[\"https://static.gitbook.com/_next/static/css/9008e36b498d813c.css\",\"style\"]\n9:HL[\"https://static.gitbook.com/_next/static/css/2567c890e467e55b.css\",\"style\"]\na:HL[\"https://static.gitbook.com/_next/static/css/79eda1c72751119a.css\",\"style\"]\nb:HL[\"https://static.gitbook.com/_next/static/css/4af9aafd612346fe.css\",\"style\"]\nc:I[11815,[],\"default\"]\nf:I[55092,[],\"default\"]\n11:I[82023,[],\"default\"]\n16:I[44622,[\"6470\",\"static/chunks/app/global-error-185b8d6d9c549d21.js\"],\"default\"]\n10:[\"pathname\",\"guides/framework-integration/vue-3\",\"oc\"]\n17:[]\n0:[\"$\",\"$Lc\",null,{\"buildId\":\"6q8mib-1OoDIqXjLTigWB\",\"assetPrefix\":\"https://static.gitbook.com\",\"urlParts\":[\"\",\"guides\",\"framework-integration\",\"vue-3\"],\"initialTree\":[\"\",{\"children\":[\"middleware\",{\"children\":[\"(site)\",{\"children\":[\"(content)\",{\"children\":[[\"pathname\",\"guides/framework-integration/vue-3\",\"oc\"],{\"children\":[\"__PAGE__?{\\\"pathname\\\":[\\\"guides\\\",\\\"framework-integration\\\",\\\"vue-3\\\"]}\",{}]}]}]},\"$undefined\",\"$undefined\",true]}]}],\"initialSeedData\":[\"\",{\"children\":[\"middleware\",{\"children\":[\"(site)\",{\"children\":[\"(content)\",{\"children\":[[\"pathname\",\"guides/framework-integration/vue-3\",\"oc\"],{\"children\":[\"__PAGE__\",{},[[\"$Ld\",\"$Le\",[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"https://static.gitbook.com/_next/static/css/faa0908d2237c5e3.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}],[\"$\",\"link\",\"1\",{\"rel\":\"stylesheet\",\"href\":\"https://static.gitbook.com/_next/static/css/9008e36b498d813c.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}],[\"$\",\"link\",\"2\",{\"rel\":\"stylesheet\",\"href\":\"https://static.gitbook.com/_next/static/css/2567c890e467e55b.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}],[\"$\",\"link\",\"3\",{\"rel\":\"stylesheet\",\"href\":\"https://static.gitbook.com/_next/static/css/79eda1c72751119a.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}],[\"$\",\"link\",\"4\",{\"rel\":\"stylesheet\",\"href\":\"https://static.gitbook.com/_next/static/css/4af9aafd612346fe.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}]]],null],null]},[null,[\"$\",\"$Lf\",null,{\"parallelRouterKey\":\"children\",\"segmentPath\":[\"children\",\"middleware\",\"children\",\"(site)\",\"children\",\"(content)\",\"children\",\"$10\",\"children\"],\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L11\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$L12\",\"notFoundStyles\":[]}]],[[\"$\",\"div\",null,{\"className\":\"flex flex-row flex-1 relative py-8 lg:px-16 xl:mr-56 items-center lg:items-start\",\"children\":[\"$\",\"div\",null,{\"className\":\"flex-1 max-w-3xl mx-auto page-full-width:mx-0\",\"children\":[[\"$\",\"div\",null,{\"id\":\"$undefined\",\"role\":\"status\",\"aria-busy\":true,\"className\":\"mb-8\",\"children\":[\"$\",\"div\",null,{\"className\":\"ring-1 ring-tint-subtle overflow-hidden relative grid rounded-md h-[47px] [max-width:calc(48rem-1px)]\",\"children\":[\"$\",\"div\",null,{\"className\":\"w-full bg-tint grid grid-area-1-1 overflow-hidden [mask:conic-gradient(from_90deg_at_1px_1px,_#0000_90deg,_#0003_0)_calc(50%+1px)_calc(0%+47px)_/_12px_12px]\",\"children\":[\"$\",\"div\",null,{\"className\":\"aspect-square from-tint-solid to-transparent grid-area-1-1 relative origin-[50%_50%] top-[50%] self-stretch bg-transparent will-change-transform animate-[rotateLoop_2s_linear_infinite] [background-image:conic-gradient(from_-90deg_at_50%_50%,_var(--tw-gradient-stops)_0deg,_var(--tw-gradient-stops)_90deg,_var(--tw-gradient-stops)_280deg)]\"}]}]}]}],[\"$\",\"div\",null,{\"id\":\"$undefined\",\"role\":\"status\",\"aria-busy\":true,\"className\":\"skeleton-paragraph\",\"children\":[\"$\",\"div\",null,{\"className\":\"ring-1 ring-tint-s"])</script><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">self.__next_f.push([1,"ubtle overflow-hidden relative grid rounded-md [height:calc(15rem-1px)] [max-width:calc(48rem-1px)] mb-4\",\"children\":[\"$\",\"div\",null,{\"className\":\"w-full bg-tint grid grid-area-1-1 overflow-hidden [mask:conic-gradient(from_90deg_at_1px_1px,_#0000_90deg,_#0003_0)_calc(50%+1px)_calc(0%+47px)_/_48px_48px]\",\"children\":[\"$\",\"div\",null,{\"className\":\"aspect-square from-tint-solid to-transparent grid-area-1-1 relative origin-[50%_50%] top-[50%] self-stretch bg-transparent will-change-transform animate-[rotateLoop_2s_linear_infinite] [background-image:conic-gradient(from_-90deg_at_50%_50%,_var(--tw-gradient-stops)_0deg,_var(--tw-gradient-stops)_90deg,_var(--tw-gradient-stops)_280deg)]\"}]}]}]}]]}]}],[],[]]]},[[[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"https://static.gitbook.com/_next/static/css/09a5087aafb66ce5.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}]],\"$L13\"],null],null]},[[[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"https://static.gitbook.com/_next/static/css/9f5478b23a2dbc0b.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}],[\"$\",\"link\",\"1\",{\"rel\":\"stylesheet\",\"href\":\"https://static.gitbook.com/_next/static/css/c689b5a6a1432db7.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}],[\"$\",\"link\",\"2\",{\"rel\":\"stylesheet\",\"href\":\"https://static.gitbook.com/_next/static/css/619939f8b811f942.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}],[\"$\",\"link\",\"3\",{\"rel\":\"stylesheet\",\"href\":\"https://static.gitbook.com/_next/static/css/95b358fb5c9305a3.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}]],\"$L14\"],null],null]},[null,[\"$\",\"$Lf\",null,{\"parallelRouterKey\":\"children\",\"segmentPath\":[\"children\",\"middleware\",\"children\"],\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L11\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"notFoundStyles\":\"$undefined\"}]],null]},[null,[\"$\",\"$Lf\",null,{\"parallelRouterKey\":\"children\",\"segmentPath\":[\"children\"],\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L11\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":[[\"$\",\"title\",null,{\"children\":\"404: This page could not be found.\"}],[\"$\",\"div\",null,{\"style\":{\"fontFamily\":\"system-ui,\\\"Segoe UI\\\",Roboto,Helvetica,Arial,sans-serif,\\\"Apple Color Emoji\\\",\\\"Segoe UI Emoji\\\"\",\"height\":\"100vh\",\"textAlign\":\"center\",\"display\":\"flex\",\"flexDirection\":\"column\",\"alignItems\":\"center\",\"justifyContent\":\"center\"},\"children\":[\"$\",\"div\",null,{\"children\":[[\"$\",\"style\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}\"}}],[\"$\",\"h1\",null,{\"className\":\"next-error-h1\",\"style\":{\"display\":\"inline-block\",\"margin\":\"0 20px 0 0\",\"padding\":\"0 23px 0 0\",\"fontSize\":24,\"fontWeight\":500,\"verticalAlign\":\"top\",\"lineHeight\":\"49px\"},\"children\":\"404\"}],[\"$\",\"div\",null,{\"style\":{\"display\":\"inline-block\"},\"children\":[\"$\",\"h2\",null,{\"style\":{\"fontSize\":14,\"fontWeight\":400,\"lineHeight\":\"49px\",\"margin\":0},\"children\":\"This page could not be found.\"}]}]]}]}]],\"notFoundStyles\":[]}]],null],\"couldBeIntercepted\":false,\"initialHead\":[null,\"$L15\"],\"globalErrorComponent\":\"$16\",\"missingSlots\":\"$W17\"}]\n19:I[5145,[\"9322\",\"static/chunks/9322-5f5740cd5fd0bdf9.js\",\"4183\",\"static/chunks/app/middleware/(site)/layout-1a4e0bf6da1d58a4.js\"],\"IconsProvider\"]\n1a:I[75489,[\"9322\",\"static/chunks/9322-5f5740cd5fd0bdf9.js\",\"4183\",\"static/chunks/app/middleware/(site)/layout-1a4e0bf6da1d58a4.js\"],\"ClientContexts\"]\n1b:I[61946,[\"2622\",\"static/chunks/2622-d4284e72be418b70.js\",\"7609\",\"static/chunks/7609-5073804535dff38c.js\",\"983\",\"static/chunks/983-4fad0180b495256f.js\",\"8626\",\"static/chunks/app/middleware/(site)/error-65349dd045e81a2f.js\"],\"default\"]\n18:T139c,\n :root {\n --primary-1: 251 255 255; --contrast-primary-1: 29 29 29;\n--primary-2: 243 251 255; --contrast-primary-2: 29 29 29;\n--primary-3:"])</script><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">self.__next_f.push([1," 237 248 255; --contrast-primary-3: 29 29 29;\n--primary-4: 228 243 255; --contrast-primary-4: 29 29 29;\n--primary-5: 219 239 255; --contrast-primary-5: 29 29 29;\n--primary-6: 208 231 255; --contrast-primary-6: 29 29 29;\n--primary-7: 192 219 255; --contrast-primary-7: 29 29 29;\n--primary-8: 176 206 254; --contrast-primary-8: 29 29 29;\n--primary-9: 27 98 209; --contrast-primary-9: 255 255 255;\n--primary-10: 46 116 228; --contrast-primary-10: 255 255 255;\n--primary-11: 33 104 215; --contrast-primary-11: 255 255 255;\n--primary-12: 0 0 113; --contrast-primary-12: 255 255 255;\n--primary-original: 27 98 209; --contrast-primary-original: 255 255 255;\n --tint-1: 254 255 255; --contrast-tint-1: 29 29 29;\n--tint-2: 248 250 252; --contrast-tint-2: 29 29 29;\n--tint-3: 245 248 251; --contrast-tint-3: 29 29 29;\n--tint-4: 239 242 247; --contrast-tint-4: 29 29 29;\n--tint-5: 234 237 244; --contrast-tint-5: 29 29 29;\n--tint-6: 225 230 237; --contrast-tint-6: 29 29 29;\n--tint-7: 212 217 226; --contrast-tint-7: 29 29 29;\n--tint-8: 199 205 214; --contrast-tint-8: 29 29 29;\n--tint-9: 120 134 156; --contrast-tint-9: 255 255 255;\n--tint-10: 109 122 144; --contrast-tint-10: 255 255 255;\n--tint-11: 98 111 132; --contrast-tint-11: 255 255 255;\n--tint-12: 19 29 46; --contrast-tint-12: 255 255 255;\n--tint-original: 120 120 120; --contrast-tint-original: 255 255 255;\n --neutral-1: 255 255 255; --contrast-neutral-1: 29 29 29;\n--neutral-2: 250 250 250; --contrast-neutral-2: 29 29 29;\n--neutral-3: 247 247 247; --contrast-neutral-3: 29 29 29;\n--neutral-4: 242 242 242; --contrast-neutral-4: 29 29 29;\n--neutral-5: 237 237 237; --contrast-neutral-5: 29 29 29;\n--neutral-6: 229 229 229; --contrast-neutral-6: 29 29 29;\n--neutral-7: 217 217 217; --contrast-neutral-7: 29 29 29;\n--neutral-8: 204 204 204; --contrast-neutral-8: 29 29 29;\n--neutral-9: 120 120 120; --contrast-neutral-9: 255 255 255;\n--neutral-10: 121 121 121; --contrast-neutral-10: 255 255 255;\n--neutral-11: 110 110 110; --contrast-neutral-11: 255 255 255;\n--neutral-12: 29 29 29; --contrast-neutral-12: 255 255 255;\n--neutral-original: 120 120 120; --contrast-neutral-original: 255 255 255;\n\n --header-background: 27 98 209;\n --header-link: 255 255 255;\n }\n\n .dark {\n --primary-1: 27 29 34; --contrast-primary-1: 255 255 255;\n--primary-2: 29 35 44; --contrast-primary-2: 255 255 255;\n--primary-3: 36 44 58; --contrast-primary-3: 255 255 255;\n--primary-4: 37 48 67; --contrast-primary-4: 255 255 255;\n--primary-5: 39 54 77; --contrast-primary-5: 255 255 255;\n--primary-6: 40 58 86; --contrast-primary-6: 255 255 255;\n--primary-7: 47 68 102; --contrast-primary-7: 255 255 255;\n--primary-8: 53 78 118; --contrast-primary-8: 255 255 255;\n--primary-9: 27 98 209; --contrast-primary-9: 255 255 255;\n--primary-10: 70 140 255; --contrast-primary-10: 255 255 255;\n--primary-11: 117 190 255; --contrast-primary-11: 29 29 29;\n--primary-12: 178 255 255; --contrast-primary-12: 29 29 29;\n--primary-original: 27 98 209; --contrast-primary-original: 255 255 255;\n --tint-1: 29 29 29; --contrast-tint-1: 255 255 255;\n--tint-2: 34 35 35; --contrast-tint-2: 255 255 255;\n--tint-3: 43 44 45; --contrast-tint-3: 255 255 255;\n--tint-4: 47 48 50; --contrast-tint-4: 255 255 255;\n--tint-5: 52 54 56; --contrast-tint-5: 255 255 255;\n--tint-6: 56 58 60; --contrast-tint-6: 255 255 255;\n--tint-7: 66 68 71; --contrast-tint-7: 255 255 255;\n--tint-8: 75 78 82; --contrast-tint-8: 255 255 255;\n--tint-9: 126 133 144; --contrast-tint-9: 255 255 255;\n--tint-10: 138 145 156; --contrast-tint-10: 255 255 255;\n--tint-11: 185 193 204; --contrast-tint-11: 29 29 29;\n--tint-12: 248 255 255; --contrast-tint-12: 29 29 29;\n--tint-original: 120 120 120; --contrast-tint-original: 255 255 255;\n --neutral-1: 29 29 29; --contrast-neutral-1: 255 255 255;\n--neutral-2: 34 34 34; --contrast-neutral-2: 255 255 255;\n--neutral-3: 44 44 44; --contrast-neutral-3: 255 255 255;\n--neutral-4: "])</script><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">self.__next_f.push([1,"48 48 48; --contrast-neutral-4: 255 255 255;\n--neutral-5: 53 53 53; --contrast-neutral-5: 255 255 255;\n--neutral-6: 57 57 57; --contrast-neutral-6: 255 255 255;\n--neutral-7: 67 67 67; --contrast-neutral-7: 255 255 255;\n--neutral-8: 78 78 78; --contrast-neutral-8: 255 255 255;\n--neutral-9: 120 120 120; --contrast-neutral-9: 255 255 255;\n--neutral-10: 144 144 144; --contrast-neutral-10: 255 255 255;\n--neutral-11: 192 192 192; --contrast-neutral-11: 29 29 29;\n--neutral-12: 255 255 255; --contrast-neutral-12: 29 29 29;\n--neutral-original: 120 120 120; --contrast-neutral-original: 255 255 255;\n\n --header-background: 27 98 209;\n --header-link: 255 255 255;\n }\n 14:[\"$\",\"html\",null,{\"suppressHydrationWarning\":true,\"lang\":\"en\",\"className\":\"scroll-pt-[76px] theme-clean no-tint sidebar-filled sidebar-list-pill\",\"children\":[[\"$\",\"head\",null,{\"children\":[null,[\"$\",\"style\",null,{\"nonce\":\"$undefined\",\"children\":\"$18\"}]]}],[\"$\",\"body\",null,{\"className\":\"__className_2f5617 __className_7d852e __variable_96046e bg-tint-base theme-muted:bg-tint-subtle theme-bold-tint:bg-tint-subtle theme-gradient:bg-gradient-primary theme-gradient-tint:bg-gradient-tint\",\"children\":[\"$\",\"$L19\",null,{\"assetsURL\":\"https://ka-p.fontawesome.com/releases/v6.6.0/\",\"assetsURLToken\":\"a463935e93\",\"assetsByStyles\":{\"custom-icons\":{\"assetsURL\":\"https://static.gitbook.com/~gitbook/static/icons\"}},\"iconStyle\":\"regular\",\"children\":[\"$\",\"$L1a\",null,{\"language\":{\"locale\":\"en\",\"powered_by_gitbook\":\"Powered by GitBook\",\"sponsored_via_gitbook\":\"Sponsored via GitBook\",\"switch_to_dark_theme\":\"Switch to dark theme\",\"switch_to_light_theme\":\"Switch to light theme\",\"switch_to_system_theme\":\"Switch to system theme\",\"search\":\"Search\",\"search_or_ask\":\"Ask or search\",\"search_input_placeholder\":\"Search content\",\"search_ask_input_placeholder\":\"Search content or ask a question\",\"search_no_results\":\"No results for \\\"${1}\\\".\",\"search_scope_space\":\"$${1}\",\"search_scope_all\":\"All content\",\"search_ask\":\"Ask \\\"${1}\\\"\",\"search_ask_description\":\"Find the answer with AI\",\"search_ask_sources\":\"Sources\",\"search_ask_sources_no_answer\":\"Related pages\",\"search_ask_no_answer\":\"An answer could not be found for your question. You could try rephrasing it, or be more specific.\",\"search_ask_error\":\"Something went wrong. Please try again later.\",\"on_this_page\":\"On this page\",\"next_page\":\"Next\",\"previous_page\":\"Previous\",\"page_last_modified\":\"Last updated ${1}\",\"was_this_helpful\":\"Was this helpful?\",\"was_this_helpful_positive\":\"Yes, it was!\",\"was_this_helpful_neutral\":\"Not sure\",\"was_this_helpful_negative\":\"No\",\"was_this_helpful_thank_you\":\"Thank you!\",\"was_this_helpful_comment\":\"Anything you'd like to add?\",\"submit\":\"Submit\",\"annotation_button_label\":\"Open annotation\",\"code_copied\":\"Copied!\",\"code_copy\":\"Copy\",\"table_of_contents_button_label\":\"Open table of contents\",\"cookies_title\":\"Cookies\",\"cookies_prompt\":\"This site uses cookies to deliver its service and to analyse traffic. By browsing this site, you accept the ${1}.\",\"cookies_prompt_privacy\":\"privacy policy\",\"cookies_accept\":\"Accept\",\"cookies_reject\":\"Reject\",\"cookies_close\":\"Close\",\"edit_on_git\":\"Edit on ${1}\",\"notfound_title\":\"Page not found\",\"notfound\":\"The page you are looking for doesn't exist.\",\"unexpected_error_title\":\"An error occurred\",\"unexpected_error\":\"Sorry, an unexpected error has occurred. Please try again later.\",\"unexpected_error_retry\":\"Retry\",\"pdf_download\":\"Export as PDF\",\"pdf_goback\":\"Go back to content\",\"pdf_print\":\"Print or Save as PDF\",\"pdf_page_of\":\"$${1} of ${2}\",\"pdf_mode_only_page\":\"Only this page\",\"pdf_mode_all\":\"All pages\",\"pdf_limit_reached\":\"Couldn't generate the PDF for ${1} pages, generation stopped at ${2}.\",\"pdf_limit_reached_continue\":\"Extend with ${1} more pages.\",\"more\":\"More\"},\"children\":[\"$\",\"$Lf\",null,{\"parallelRouterKey\":\"children\",\"segmentPath\":[\"children\",\"middleware\",\"children\",\"(site)\",\"children\"],\"error\":\"$1b\",\"errorStyles\":[],\"errorScripts\":[],\"template\":[\"$\",\"$L11\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$und"])</script><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">self.__next_f.push([1,"efined\",\"notFound\":\"$undefined\",\"notFoundStyles\":\"$undefined\"}]}]}]}]]}]\n1f:I[26700,[\"2622\",\"static/chunks/2622-d4284e72be418b70.js\",\"7609\",\"static/chunks/7609-5073804535dff38c.js\",\"2999\",\"static/chunks/2999-584f9b8ecc233405.js\",\"7993\",\"static/chunks/7993-8ef7f7477490b7af.js\",\"5890\",\"static/chunks/5890-3ab2501336ce1348.js\",\"3625\",\"static/chunks/3625-453944d6ea4368cb.js\",\"983\",\"static/chunks/983-4fad0180b495256f.js\",\"4055\",\"static/chunks/4055-7666845ca98fb1a4.js\",\"6119\",\"static/chunks/app/middleware/(site)/(content)/layout-1043f1693da1ab25.js\"],\"TrackPageViewEvent\"]\n20:I[35592,[\"2622\",\"static/chunks/2622-d4284e72be418b70.js\",\"7609\",\"static/chunks/7609-5073804535dff38c.js\",\"2999\",\"static/chunks/2999-584f9b8ecc233405.js\",\"7993\",\"static/chunks/7993-8ef7f7477490b7af.js\",\"5890\",\"static/chunks/5890-3ab2501336ce1348.js\",\"3625\",\"static/chunks/3625-453944d6ea4368cb.js\",\"983\",\"static/chunks/983-4fad0180b495256f.js\",\"4055\",\"static/chunks/4055-7666845ca98fb1a4.js\",\"6119\",\"static/chunks/app/middleware/(site)/(content)/layout-1043f1693da1ab25.js\"],\"NuqsAdapter\"]\n21:I[2092,[\"2622\",\"static/chunks/2622-d4284e72be418b70.js\",\"7609\",\"static/chunks/7609-5073804535dff38c.js\",\"2999\",\"static/chunks/2999-584f9b8ecc233405.js\",\"7993\",\"static/chunks/7993-8ef7f7477490b7af.js\",\"5890\",\"static/chunks/5890-3ab2501336ce1348.js\",\"3625\",\"static/chunks/3625-453944d6ea4368cb.js\",\"983\",\"static/chunks/983-4fad0180b495256f.js\",\"4055\",\"static/chunks/4055-7666845ca98fb1a4.js\",\"6119\",\"static/chunks/app/middleware/(site)/(content)/layout-1043f1693da1ab25.js\"],\"ClientContexts\"]\n23:I[49780,[\"2622\",\"static/chunks/2622-d4284e72be418b70.js\",\"7609\",\"static/chunks/7609-5073804535dff38c.js\",\"2999\",\"static/chunks/2999-584f9b8ecc233405.js\",\"7993\",\"static/chunks/7993-8ef7f7477490b7af.js\",\"5890\",\"static/chunks/5890-3ab2501336ce1348.js\",\"3625\",\"static/chunks/3625-453944d6ea4368cb.js\",\"983\",\"static/chunks/983-4fad0180b495256f.js\",\"4055\",\"static/chunks/4055-7666845ca98fb1a4.js\",\"6119\",\"static/chunks/app/middleware/(site)/(content)/layout-1043f1693da1ab25.js\"],\"LoadIntegrations\"]\n24:\"$Sreact.suspense\"\n25:I[35489,[\"2622\",\"static/chunks/2622-d4284e72be418b70.js\",\"7609\",\"static/chunks/7609-5073804535dff38c.js\",\"2999\",\"static/chunks/2999-584f9b8ecc233405.js\",\"7993\",\"static/chunks/7993-8ef7f7477490b7af.js\",\"5890\",\"static/chunks/5890-3ab2501336ce1348.js\",\"3625\",\"static/chunks/3625-453944d6ea4368cb.js\",\"983\",\"static/chunks/983-4fad0180b495256f.js\",\"4055\",\"static/chunks/4055-7666845ca98fb1a4.js\",\"6119\",\"static/chunks/app/middleware/(site)/(content)/layout-1043f1693da1ab25.js\"],\"CookiesToast\"]\n1c:HC\"https://api.gitbook.com\"\n1d:HC\"https://static.gitbook.com\"\n1e:HL[\"https://integrations.gitbook.com/v1/integrations/googleanalytics/installations/e065268d3cfde995f1ec1f24663200b92f6579eef7efe5f0273305a8d9f077ce/sites/site_S8gms/script.js?version=150.0\",\"script\",{\"nonce\":\"NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx\"}]\n12:[\"$\",\"div\",null,{\"className\":\"flex-1 flex flex-row items-center justify-center py-9 min-h-[calc(100vh-64px)] lg:min-h-fit\",\"children\":[[\"$\",\"div\",null,{\"className\":\"max-w-80\",\"children\":[[\"$\",\"h2\",null,{\"className\":\"text-2xl font-semibold mb-2\",\"children\":\"Page not found\"}],[\"$\",\"p\",null,{\"className\":\"text-base mb-4\",\"children\":\"The page you are looking for doesn't exist.\"}]]}],[\"$\",\"$L1f\",null,{\"pageId\":null,\"revisionId\":\"9RCb0iQnzhfbMBPfinU4\"}]]}]\n13:[\"$\",\"$L20\",null,{\"children\":[\"$\",\"$L21\",null,{\"nonce\":\"NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx\",\"forcedTheme\":\"$undefined\",\"children\":[\"$L22\",[[\"$\",\"$L23\",null,{}],[[\"$\",\"script\",\"https://integrations.gitbook.com/v1/integrations/googleanalytics/installations/e065268d3cfde995f1ec1f24663200b92f6579eef7efe5f0273305a8d9f077ce/sites/site_S8gms/script.js?version=150.0\",{\"async\":true,\"src\":\"https://integrations.gitbook.com/v1/integrations/googleanalytics/installations/e065268d3cfde995f1ec1f24663200b92f6579eef7efe5f0273305a8d9f077ce/sites/site_S8gms/script.js?version=150.0\",\"nonce\":\"NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx\"}]]],[\"$\",\"$24\",null,{\"fallback\":null,\"children\":[\"$\",\"$L25\",null,{\"privacyPolicy\":\"$undefined\"}"])</script><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">self.__next_f.push([1,"]}],[\"$\",\"script\",null,{\"nonce\":\"NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx\",\"suppressHydrationWarning\":true,\"data-cfasync\":\"false\",\"dangerouslySetInnerHTML\":{\"__html\":\"\\n document.addEventListener(\\\"DOMContentLoaded\\\", () =\u003e {\\n if (Array.from(document.scripts).find(script =\u003e script.src.includes('rocket-loader.min.js'))) {\\n const alert = document.createElement('div');\\n alert.className = 'p-4 mb-4 text-sm text-red-800 rounded-lg bg-red-50 mt-8 mx-8';\\n alert.innerHTML = `\\n \u003cstrong\u003eError in site configuration:\u003c/strong\u003e\\n It looks like ${window.location.hostname} has been incorrectly configured in Cloudflare. This may lead to unexpected behavior or issues with the page loading. If you are the owner of this site, please refer to \u003ca href=\\\"https://docs.gitbook.com/published-documentation/custom-domain/configure-dns#are-you-using-cloudflare\\\" class=\\\"underline\\\"\u003eGitBook's documentation\u003c/a\u003e for steps to fix the problem.\\n `;\\n\\n document.body.prepend(alert);\\n }\\n });\"}}],\"$L26\"]}]}]\n27:I[31200,[\"2622\",\"static/chunks/2622-d4284e72be418b70.js\",\"7609\",\"static/chunks/7609-5073804535dff38c.js\",\"2999\",\"static/chunks/2999-584f9b8ecc233405.js\",\"7993\",\"static/chunks/7993-8ef7f7477490b7af.js\",\"5890\",\"static/chunks/5890-3ab2501336ce1348.js\",\"3625\",\"static/chunks/3625-453944d6ea4368cb.js\",\"983\",\"static/chunks/983-4fad0180b495256f.js\",\"4055\",\"static/chunks/4055-7666845ca98fb1a4.js\",\"6119\",\"static/chunks/app/middleware/(site)/(content)/layout-1043f1693da1ab25.js\"],\"InsightsProvider\"]\n28:I[19284,[\"2622\",\"static/chunks/2622-d4284e72be418b70.js\",\"7609\",\"static/chunks/7609-5073804535dff38c.js\",\"2999\",\"static/chunks/2999-584f9b8ecc233405.js\",\"7993\",\"static/chunks/7993-8ef7f7477490b7af.js\",\"5890\",\"static/chunks/5890-3ab2501336ce1348.js\",\"3625\",\"static/chunks/3625-453944d6ea4368cb.js\",\"983\",\"static/chunks/983-4fad0180b495256f.js\",\"4055\",\"static/chunks/4055-7666845ca98fb1a4.js\",\"6119\",\"static/chunks/app/middleware/(site)/(content)/layout-1043f1693da1ab25.js\"],\"HeaderMobileMenu\"]\n2a:I[86604,[\"2622\",\"static/chunks/2622-d4284e72be418b70.js\",\"7609\",\"static/chunks/7609-5073804535dff38c.js\",\"2999\",\"static/chunks/2999-584f9b8ecc233405.js\",\"7993\",\"static/chunks/7993-8ef7f7477490b7af.js\",\"5890\",\"static/chunks/5890-3ab2501336ce1348.js\",\"3625\",\"static/chunks/3625-453944d6ea4368cb.js\",\"983\",\"static/chunks/983-4fad0180b495256f.js\",\"4055\",\"static/chunks/4055-7666845ca98fb1a4.js\",\"6119\",\"static/chunks/app/middleware/(site)/(content)/layout-1043f1693da1ab25.js\"],\"SearchButton\"]\n2b:I[19656,[\"2622\",\"static/chunks/2622-d4284e72be418b70.js\",\"7609\",\"static/chunks/7609-5073804535dff38c.js\",\"2999\",\"static/chunks/2999-584f9b8ecc233405.js\",\"7993\",\"static/chunks/7993-8ef7f7477490b7af.js\",\"5890\",\"static/chunks/5890-3ab2501336ce1348.js\",\"3625\",\"static/chunks/3625-453944d6ea4368cb.js\",\"983\",\"static/chunks/983-4fad0180b495256f.js\",\"4055\",\"static/chunks/4055-7666845ca98fb1a4.js\",\"6119\",\"static/chunks/app/middleware/(site)/(content)/layout-1043f1693da1ab25.js\"],\"TOCScrollContainer\"]\n43:I[22833,[\"2622\",\"static/chunks/2622-d4284e72be418b70.js\",\"7609\",\"static/chunks/7609-5073804535dff38c.js\",\"2999\",\"static/chunks/2999-584f9b8ecc233405.js\",\"7993\",\"static/chunks/7993-8ef7f7477490b7af.js\",\"5890\",\"static/chunks/5890-3ab2501336ce1348.js\",\"3625\",\"static/chunks/3625-453944d6ea4368cb.js\",\"983\",\"static/chunks/983-4fad0180b495256f.js\",\"4055\",\"static/chunks/4055-7666845ca98fb1a4.js\",\"6119\",\"static/chunks/app/middleware/(site)/(content)/layout-1043f1693da1ab25.js\"],\"Link\"]\n44:I[22563,[\"9322\",\"static/chunks/9322-5f5740cd5fd0bdf9.js\",\"4183\",\"static/chunks/app/middleware/(site)/layout-1a4e0bf6da1d58a4.js\"],\"Icon\"]\n45:I[42663,[\"2622\",\"static/chunks/2622-d4284e72be418b70.js\",\"7609\",\"static/chunks/7609-5073804535dff38c.js\",\"2999\",\"static/chunks/2999-584f9b8ecc233405.js\",\"7993\",\"static/chunks/7993-8ef7f7477490b7af.js\",\"5890\",\"static/chunks/5890-3ab2501336ce1348.js\",\"3625\",\"static/chunks/3625-453944d6ea4368cb.js\",\"983\",\"static/chunks/983-4fad0180b495256f.js\",\"4055\",\"static/chun"])</script><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">self.__next_f.push([1,"ks/4055-7666845ca98fb1a4.js\",\"6119\",\"static/chunks/app/middleware/(site)/(content)/layout-1043f1693da1ab25.js\"],\"ThemeToggler\"]\n46:I[42579,[\"2622\",\"static/chunks/2622-d4284e72be418b70.js\",\"7609\",\"static/chunks/7609-5073804535dff38c.js\",\"2999\",\"static/chunks/2999-584f9b8ecc233405.js\",\"7993\",\"static/chunks/7993-8ef7f7477490b7af.js\",\"5890\",\"static/chunks/5890-3ab2501336ce1348.js\",\"3625\",\"static/chunks/3625-453944d6ea4368cb.js\",\"983\",\"static/chunks/983-4fad0180b495256f.js\",\"4055\",\"static/chunks/4055-7666845ca98fb1a4.js\",\"6119\",\"static/chunks/app/middleware/(site)/(content)/layout-1043f1693da1ab25.js\"],\"SearchModal\"]\n26:null\n22:[\"$\",\"$L27\",null,{\"enabled\":true,\"apiHost\":\"https://api.gitbook.com\",\"visitorAuthToken\":null,\"siteId\":\"site_S8gms\",\"spaceId\":\"-LBKK1y7h_XWAtuRJG9X-4037718589\",\"organizationId\":\"-LBKDRmeoAGTb1M5X51f\",\"siteSectionId\":\"$undefined\",\"siteSpaceId\":\"sitesp_qbSyB\",\"siteShareKey\":\"$undefined\",\"revisionId\":\"$undefined\",\"changeRequestId\":\"$undefined\",\"children\":[[\"$\",\"header\",null,{\"id\":\"site-header\",\"className\":\"flex flex-col h-[64px] sticky top-0 z-10 w-full flex-none shadow-[0px_1px_0px] shadow-tint-12/2 bg-tint-base/9 theme-muted:bg-tint-subtle/9 theme-bold-tint:bg-tint-subtle/9 theme-gradient:bg-gradient-primary theme-gradient-tint:bg-gradient-tint contrast-more:bg-tint-base text-sm backdrop-blur-lg\",\"children\":[[\"$\",\"div\",null,{\"className\":\"theme-bold:bg-header-background theme-bold:shadow-[0px_1px_0px] theme-bold:shadow-tint-12/2\",\"children\":[\"$\",\"div\",null,{\"className\":\"scroll-nojump\",\"children\":[\"$\",\"div\",null,{\"className\":\"gap-4 lg:gap-8 flex items-center justify-between w-full py-3 min-h-16 sm:h-16 px-4 sm:px-6 md:px-8 max-w-screen-2xl mx-auto page-full-width:max-w-full\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex max-w-full shrink min-w-0 gap-2 lg:gap-4 justify-start items-center\",\"children\":[[\"$\",\"$L28\",null,{\"className\":\"lg:hidden -ml-2 text-tint-strong theme-bold:text-header-link hover:bg-tint-hover theme-bold:hover:bg-header-link/3\"}],\"$L29\"]}],false,false,[\"$\",\"div\",null,{\"className\":\"flex md:min-w-56 grow-0 shrink-0 justify-self-end\",\"children\":[\"$\",\"$24\",null,{\"fallback\":null,\"children\":[\"$\",\"$L2a\",null,{\"style\":[\"theme-bold:bg-header-link/2\",\"theme-bold:hover:bg-header-link/3\",\"theme-bold:text-header-link/8\",\"theme-bold:hover:text-header-link\",\"theme-bold:ring-header-link/4\",\"theme-bold:hover:ring-header-link/5\",\"theme-bold:[\u0026_svg]:text-header-link/10\",\"theme-bold:[\u0026_.shortcut]:text-header-link/8\",\"theme-bold:contrast-more:bg-header-background\",\"theme-bold:contrast-more:text-header-link\",\"theme-bold:contrast-more:ring-header-link\",\"theme-bold:contrast-more:hover:bg-header-background\",\"theme-bold:contrast-more:hover:ring-header-link\",\"theme-bold:contrast-more:focus:text-header-link\",\"theme-bold:contrast-more:focus:bg-header-background\",\"theme-bold:contrast-more:focus:ring-header-link\",\"theme-bold:shadow-none\",\"theme-bold:hover:shadow-none\"],\"children\":[\"$\",\"span\",null,{\"className\":\"flex-1\",\"children\":[\"Search\",\"...\"]}]}]}]}]]}]}]}],null]}],[\"$\",\"div\",null,{\"className\":\"flex flex-col lg:flex-row px-4 sm:px-6 md:px-8 max-w-screen-2xl mx-auto page-full-width:max-w-full min-h-[calc(100vh-64px)]\",\"children\":[[\"$\",\"aside\",null,{\"data-testid\":\"table-of-contents\",\"className\":\"group page-no-toc:hidden grow-0 shrink-0 basis-full lg:basis-72 relative z-[1] lg:sticky lg:top-0 lg:h-screen site-header:lg:top-16 site-header:lg:h-[calc(100vh_-_4rem)] site-header-sections:lg:top-[6.75rem] site-header-sections:lg:h-[calc(100vh_-_6.75rem)] pt-6 pb-4 sidebar-filled:lg:pr-6 hidden navigation-open:flex lg:flex flex-col gap-4 navigation-open:border-b border-tint-subtle\",\"children\":[null,[\"$\",\"div\",null,{\"className\":\"lg:-ms-5 overflow-hidden relative flex flex-col flex-grow sidebar-filled:bg-tint-subtle theme-muted:bg-tint-subtle theme-bold-tint:bg-tint-subtle [html.sidebar-filled.theme-muted_\u0026]:bg-tint-base [html.sidebar-filled.theme-bold.tint_\u0026]:bg-tint-base sidebar-filled:rounded-xl straight-corners:rounded-none\",\"children\":[[\"$\",\"div\",null,{\"className\":\"px-5 *:my-4\",\"children\":[false,false,false]}],[\"$\",\"$L2b\","])</script><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">self.__next_f.push([1,"null,{\"className\":\"flex flex-grow flex-col p-2 lg:pb-20 overflow-y-auto lg:gutter-stable [\u0026::-webkit-scrollbar]:bg-transparent [\u0026::-webkit-scrollbar-thumb]:bg-transparent group-hover:[\u0026::-webkit-scrollbar]:bg-tint-subtle group-hover:[\u0026::-webkit-scrollbar-thumb]:bg-tint-7 group-hover:[\u0026::-webkit-scrollbar-thumb:hover]:bg-tint-8\",\"children\":[[\"$\",\"ul\",null,{\"className\":\"flex flex-col gap-y-0.5 sidebar-list-line:border-l border-tint-subtle\",\"children\":[\"$L2c\",\"$L2d\",\"$L2e\",[\"$\",\"li\",null,{\"className\":\"flex flex-col group/page-group-item\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center gap-3 px-3 z-[1] sticky -top-5 pt-6 group-first/page-group-item:-mt-5 pb-3 -mb-1.5 text-xs tracking-wide font-semibold uppercase [mask-image:linear-gradient(rgba(0,0,0,1)_70%,rgba(0,0,0,0))] bg-tint-base sidebar-filled:bg-tint-subtle theme-muted:bg-tint-subtle theme-bold-tint:bg-tint-subtle [html.sidebar-filled.theme-muted_\u0026]:bg-tint-base [html.sidebar-filled.theme-bold.tint_\u0026]:bg-tint-base [html.sidebar-default.theme-gradient_\u0026]:bg-gradient-primary [html.sidebar-default.theme-gradient.tint_\u0026]:bg-gradient-tint\",\"children\":[\"$undefined\",\"Core Concepts\"]}],[\"$\",\"ul\",null,{\"className\":\"flex flex-col gap-y-0.5\",\"children\":[\"$L2f\",\"$L30\"]}]]}],[\"$\",\"li\",null,{\"className\":\"flex flex-col group/page-group-item\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center gap-3 px-3 z-[1] sticky -top-5 pt-6 group-first/page-group-item:-mt-5 pb-3 -mb-1.5 text-xs tracking-wide font-semibold uppercase [mask-image:linear-gradient(rgba(0,0,0,1)_70%,rgba(0,0,0,0))] bg-tint-base sidebar-filled:bg-tint-subtle theme-muted:bg-tint-subtle theme-bold-tint:bg-tint-subtle [html.sidebar-filled.theme-muted_\u0026]:bg-tint-base [html.sidebar-filled.theme-bold.tint_\u0026]:bg-tint-base [html.sidebar-default.theme-gradient_\u0026]:bg-gradient-primary [html.sidebar-default.theme-gradient.tint_\u0026]:bg-gradient-tint\",\"children\":[\"$undefined\",\"Configuration\"]}],[\"$\",\"ul\",null,{\"className\":\"flex flex-col gap-y-0.5\",\"children\":[\"$L31\",\"$L32\",\"$L33\",\"$L34\",\"$L35\",\"$L36\"]}]]}],[\"$\",\"li\",null,{\"className\":\"flex flex-col group/page-group-item\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center gap-3 px-3 z-[1] sticky -top-5 pt-6 group-first/page-group-item:-mt-5 pb-3 -mb-1.5 text-xs tracking-wide font-semibold uppercase [mask-image:linear-gradient(rgba(0,0,0,1)_70%,rgba(0,0,0,0))] bg-tint-base sidebar-filled:bg-tint-subtle theme-muted:bg-tint-subtle theme-bold-tint:bg-tint-subtle [html.sidebar-filled.theme-muted_\u0026]:bg-tint-base [html.sidebar-filled.theme-bold.tint_\u0026]:bg-tint-base [html.sidebar-default.theme-gradient_\u0026]:bg-gradient-primary [html.sidebar-default.theme-gradient.tint_\u0026]:bg-gradient-tint\",\"children\":[\"$undefined\",\"Built-in Templates\"]}],[\"$\",\"ul\",null,{\"className\":\"flex flex-col gap-y-0.5\",\"children\":[\"$L37\",\"$L38\",\"$L39\",\"$L3a\"]}]]}],[\"$\",\"li\",null,{\"className\":\"flex flex-col group/page-group-item\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center gap-3 px-3 z-[1] sticky -top-5 pt-6 group-first/page-group-item:-mt-5 pb-3 -mb-1.5 text-xs tracking-wide font-semibold uppercase [mask-image:linear-gradient(rgba(0,0,0,1)_70%,rgba(0,0,0,0))] bg-tint-base sidebar-filled:bg-tint-subtle theme-muted:bg-tint-subtle theme-bold-tint:bg-tint-subtle [html.sidebar-filled.theme-muted_\u0026]:bg-tint-base [html.sidebar-filled.theme-bold.tint_\u0026]:bg-tint-base [html.sidebar-default.theme-gradient_\u0026]:bg-gradient-primary [html.sidebar-default.theme-gradient.tint_\u0026]:bg-gradient-tint\",\"children\":[\"$undefined\",\"Guides\"]}],[\"$\",\"ul\",null,{\"className\":\"flex flex-col gap-y-0.5\",\"children\":[\"$L3b\",\"$L3c\",\"$L3d\",\"$L3e\"]}]]}],[\"$\",\"li\",null,{\"className\":\"flex flex-col group/page-group-item\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center gap-3 px-3 z-[1] sticky -top-5 pt-6 group-first/page-group-item:-mt-5 pb-3 -mb-1.5 text-xs tracking-wide font-semibold uppercase [mask-image:linear-gradient(rgba(0,0,0,1)_70%,rgba(0,0,0,0))] bg-tint-base sidebar-filled:bg-tint-subtle theme-muted:bg-tint-subtle theme-bold-tint:bg-tint-subtle [html.sidebar-filled.theme-muted_\u0026]:bg-tint-base [html.si"])</script><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">self.__next_f.push([1,"debar-filled.theme-bold.tint_\u0026]:bg-tint-base [html.sidebar-default.theme-gradient_\u0026]:bg-gradient-primary [html.sidebar-default.theme-gradient.tint_\u0026]:bg-gradient-tint\",\"children\":[\"$undefined\",\"Advanced\"]}],[\"$\",\"ul\",null,{\"className\":\"flex flex-col gap-y-0.5\",\"children\":[\"$L3f\",\"$L40\",\"$L41\",\"$L42\"]}]]}]]}],[\"$\",\"div\",null,{\"className\":\"relative z-[2] lg:absolute mt-6 left-0 right-2 bottom-0 pointer-events-none sidebar-filled:pl-2 sidebar-filled:pb-2 bg-tint-base sidebar-filled:bg-tint-subtle theme-muted:bg-tint-subtle [html.sidebar-filled.theme-muted_\u0026]:bg-tint-base [html.sidebar-filled.theme-bold.tint_\u0026]:bg-tint-base before:hidden lg:before:block before:content-[\\\"\\\"] before:absolute before:inset-x-0 before:bottom-full before:h-8 before:bg-gradient-to-b before:from-transparent before:to-tint-base sidebar-filled:before:to-tint-subtle theme-muted:before:to-tint-subtle theme-bold-tint:before:to-tint-subtle [html.sidebar-filled.theme-muted_\u0026]:before:to-tint-base [html.sidebar-filled.theme-bold.tint_\u0026]:before:to-tint-base\",\"children\":[\"$\",\"$L43\",null,{\"target\":\"_blank\",\"href\":\"https://www.gitbook.com/?utm_source=content\u0026utm_medium=trademark\u0026utm_campaign=-LBKK1y7h_XWAtuRJG9X-4037718589\",\"className\":\"text-sm font-semibold text-tint flex flex-row items-center px-5 py-4 sidebar-filled:px-3 rounded-lg straight-corners:rounded-none hover:bg-tint hover:text-tint-strong ring-2 lg:ring-1 ring-inset ring-tint-subtle transition-colors pointer-events-auto\",\"insights\":{\"type\":\"trademark_click\",\"placement\":\"sidebar\"},\"children\":[[\"$\",\"$L44\",null,{\"icon\":\"gitbook\",\"className\":\"size-5 mr-3\"}],\"Powered by GitBook\"]}]}]]}]]}]]}],[\"$\",\"div\",null,{\"className\":\"flex-1 flex flex-col\",\"children\":[\"$\",\"$Lf\",null,{\"parallelRouterKey\":\"children\",\"segmentPath\":[\"children\",\"middleware\",\"children\",\"(site)\",\"children\",\"(content)\",\"children\"],\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L11\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"notFoundStyles\":\"$undefined\"}]}]]}],[[\"$\",\"hr\",null,{\"className\":\"border-t border-tint-subtle\"}],[\"$\",\"div\",null,{\"className\":\"scroll-nojump\",\"children\":[\"$\",\"footer\",null,{\"className\":\"sm:px-6 md:px-8 max-w-screen-2xl page-full-width:max-w-full px-4 mx-auto flex gap-12 xl:hidden\",\"children\":[[\"$\",\"div\",null,{\"className\":\"hidden lg:block basis-72 page-no-toc:hidden\"}],[\"$\",\"div\",null,{\"className\":\"py-8 gap-12 flex flex-wrap items-start w-full flex-1 max-w-3xl page-full-width:max-w-none mx-auto\",\"children\":[null,[\"$\",\"div\",null,{\"className\":\"flex items-center justify-end ml-auto order-2 xl:hidden\",\"children\":[\"$\",\"$24\",null,{\"fallback\":null,\"children\":[\"$\",\"$L45\",null,{}]}]}],null,[\"$\",\"div\",null,{\"className\":\"mx-auto w-full grow text-xs text-tint items-center text-center order-4 flex flex-col gap-2 empty:hidden sm:order-1 sm:flex-1 sm:w-auto sm:items-start sm:max-w-3xl self-center sm:text-start\",\"children\":null}]]}],[\"$\",\"div\",null,{\"className\":\"hidden lg:block xl:basis-56 page-no-toc:hidden\"}]]}]}]],[\"$\",\"$24\",null,{\"fallback\":null,\"children\":[\"$\",\"$L46\",null,{\"revisionId\":\"9RCb0iQnzhfbMBPfinU4\",\"spaceTitle\":\"Electron Forge\",\"withAsk\":false,\"isMultiVariants\":false,\"pointer\":{\"siteId\":\"site_S8gms\",\"spaceId\":\"-LBKK1y7h_XWAtuRJG9X-4037718589\",\"organizationId\":\"-LBKDRmeoAGTb1M5X51f\",\"siteSectionId\":\"$undefined\",\"siteSpaceId\":\"sitesp_qbSyB\",\"siteShareKey\":\"$undefined\",\"revisionId\":\"$undefined\",\"changeRequestId\":\"$undefined\"}}]}]]}]\n48:I[66185,[\"2622\",\"static/chunks/2622-d4284e72be418b70.js\",\"7609\",\"static/chunks/7609-5073804535dff38c.js\",\"2999\",\"static/chunks/2999-584f9b8ecc233405.js\",\"7993\",\"static/chunks/7993-8ef7f7477490b7af.js\",\"5890\",\"static/chunks/5890-3ab2501336ce1348.js\",\"3625\",\"static/chunks/3625-453944d6ea4368cb.js\",\"983\",\"static/chunks/983-4fad0180b495256f.js\",\"4055\",\"static/chunks/4055-7666845ca98fb1a4.js\",\"6119\",\"static/chunks/app/middleware/(site)/(content)/layout-1043f1693da1ab25.js\"],\"ToggleableLinkItem\"]\n42:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L43\",null,{\"href\":\"https://js.electronforge."])</script><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">self.__next_f.push([1,"io/modules/_electron_forge_core.html\",\"className\":\"flex justify-start items-center gap-3 p-1.5 pl-3 text-sm transition-colors duration-100 text-tint-strong/7 rounded-md straight-corners:rounded-none before:content-none font-normal hover:bg-tint hover:text-tint-strong\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"url\",\"url\":\"https://js.electronforge.io/modules/_electron_forge_core.html\"},\"position\":\"sidebar\"}},\"children\":[\"$undefined\",\"API Docs\",[\"$\",\"$L44\",null,{\"icon\":\"arrow-up-right-from-square\",\"className\":\"size-3 mr-1 mt-1 place-self-start shrink-0 text-current transition-colors [\u0026\u003epath]:transition-[opacity] [\u0026\u003epath]:[opacity:0.40] group-hover:[\u0026\u003epath]:[opacity:1]\"}]]}]}]\n29:[\"$\",\"$L43\",null,{\"href\":\"/\",\"className\":\"group/headerlogo min-w-0 shrink flex items-center\",\"children\":[\"$L47\",[\"$\",\"div\",null,{\"className\":\"text-pretty line-clamp-3 tracking-tight max-w-[18ch] lg:max-w-[24ch] font-semibold ms-3 text-base/tight lg:text-lg/tight text-tint-strong theme-bold:text-header-link\",\"children\":\"Electron Forge\"}]]}]\n2c:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/\",\"pathname\":\"\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBKK1y8J4IQF5SbJ_8L\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Getting Started\"}]}]\n2d:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/import-existing-project\",\"pathname\":\"import-existing-project\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-M3hfM1tDE08IjO-TE10\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Importing an Existing Project\"}]}]\n2e:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/cli\",\"pathname\":\"cli\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBKKRZYKeYIuGiZrGY_\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"CLI\"}]}]\n2f:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/core-concepts/why-electron-forge\",\"pathname\":\"core-concepts/why-electron-forge\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"2R8Ak39VM9VWgyvVZ7LA\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Why Electron Forge?\"}]}]\n30:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/core-concepts/build-lifecycle\",\"pathname\":\"core-concepts/build-lifecycle\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"xPmFAapNUwnvNgGVjLcW\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Build Lifecycle\"}]}]\n31:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/config/configuration\",\"pathname\":\"config/configuration\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBKKKVFlxdg64cD03Tb\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Configuration Overview\"}]}]\n32:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/config/typescript-configuration\",\"pathname\":\"config/typescript-configuration\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"P0G75tpBtLL99KAmeLvO\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"TypeScript Setup\"}]}]\n33:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/config/plugins\",\"pathname\":\"config/plugins\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBKfYbASff-QwI7Z4wt\"},\"position\":\"sidebar\"}},\"descendants\":[\"$\",\"ul\",null,{\"className\":\"flex flex-col gap-y-0.5 ml-5 my-2 border-tint-subtle sidebar-list-default:border-l sidebar-list-line:border-l\",\"children\":[\"$L49\",\"$L4a\",\"$L4b\",\"$L4c\",\"$L4d\",\"$L4e\"]}],\"children\":\"Plugins\"}]}]\n34:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/config/makers\",\"pathname\":\"config/makers\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBKKg0lhUEse2zSdk3F\"},\"position\":\"sidebar\"}},\"descendants\":[\"$\",\"ul\",null,{\"className\":\"flex flex-col gap-y-0.5 ml-5 my-2 border-tint-subtle sidebar-list-default:border-l sidebar-list"])</script><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">self.__next_f.push([1,"-line:border-l\",\"children\":[\"$L4f\",\"$L50\",\"$L51\",\"$L52\",\"$L53\",\"$L54\",\"$L55\",\"$L56\",\"$L57\",\"$L58\"]}],\"children\":\"Makers\"}]}]\n35:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/config/publishers\",\"pathname\":\"config/publishers\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBKL1vDbrDqOuz1YdQZ\"},\"position\":\"sidebar\"}},\"descendants\":[\"$\",\"ul\",null,{\"className\":\"flex flex-col gap-y-0.5 ml-5 my-2 border-tint-subtle sidebar-list-default:border-l sidebar-list-line:border-l\",\"children\":[\"$L59\",\"$L5a\",\"$L5b\",\"$L5c\",\"$L5d\",\"$L5e\",\"$L5f\"]}],\"children\":\"Publishers\"}]}]\n36:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/config/hooks\",\"pathname\":\"config/hooks\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"oVRQIItg17ezJOSk7HBG\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Hooks\"}]}]\n37:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/templates/webpack-template\",\"pathname\":\"templates/webpack-template\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-Lfg5N4bY8mM-aqwL6ga\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Webpack\"}]}]\n38:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/templates/typescript-+-webpack-template\",\"pathname\":\"templates/typescript-+-webpack-template\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LwLEcBua7bZqemirctC\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Webpack + Typescript\"}]}]\n39:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/templates/vite\",\"pathname\":\"templates/vite\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"YznJeGk6XHIbSeBSsxAl\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Vite\"}]}]\n3a:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/templates/vite-+-typescript\",\"pathname\":\"templates/vite-+-typescript\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"rNKZhmnY8h97fBg3yqiu\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Vite + TypeScript\"}]}]\n3b:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/guides/code-signing\",\"pathname\":\"guides/code-signing\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"Akj0nHZpDFcf3uS3M1ee\"},\"position\":\"sidebar\"}},\"descendants\":[\"$\",\"ul\",null,{\"className\":\"flex flex-col gap-y-0.5 ml-5 my-2 border-tint-subtle sidebar-list-default:border-l sidebar-list-line:border-l\",\"children\":[\"$L60\",\"$L61\"]}],\"children\":\"Code Signing\"}]}]\n3c:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/guides/create-and-add-icons\",\"pathname\":\"guides/create-and-add-icons\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"Nm1PibSmCtjhnz3n6U3n\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Custom App Icons\"}]}]\n3d:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/guides/framework-integration\",\"pathname\":\"guides/framework-integration\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-MOjX8peUTSvcMJ6P2-0\"},\"position\":\"sidebar\"}},\"descendants\":[\"$\",\"ul\",null,{\"className\":\"flex flex-col gap-y-0.5 ml-5 my-2 border-tint-subtle sidebar-list-default:border-l sidebar-list-line:border-l\",\"children\":[null,\"$L62\",\"$L63\",\"$L64\"]}],\"children\":\"Framework Integration\"}]}]\n3e:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/guides/developing-with-wsl\",\"pathname\":\"guides/developing-with-wsl\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-MTrbL7ai0uuoUvPiMz9\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Developing with WSL\"}]}]\n3f:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/advanced/auto-update\",\"pathname\":\"advanced/auto-update\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBUCXLLP56_4W9Wcqxs\"},\"position\":\"sidebar\"}},\"descendants"])</script><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">self.__next_f.push([1,"\":null,\"children\":\"Auto Update\"}]}]\n40:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/advanced/debugging\",\"pathname\":\"advanced/debugging\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBKLBC5Xam_S76frdc2\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Debugging\"}]}]\n41:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/advanced/extending-electron-forge\",\"pathname\":\"advanced/extending-electron-forge\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBKLCQxxVq4QsaQ__Wc\"},\"position\":\"sidebar\"}},\"descendants\":[\"$\",\"ul\",null,{\"className\":\"flex flex-col gap-y-0.5 ml-5 my-2 border-tint-subtle sidebar-list-default:border-l sidebar-list-line:border-l\",\"children\":[\"$L65\",\"$L66\",\"$L67\",\"$L68\"]}],\"children\":\"Extending Electron Forge\"}]}]\n47:[\"$L69\",\"$L6a\"]\n49:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/config/plugins/webpack\",\"pathname\":\"config/plugins/webpack\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBKfwb-B6yl_H9il-oP\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Webpack Plugin\"}]}]\n4a:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/config/plugins/vite\",\"pathname\":\"config/plugins/vite\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"IXeZBQkGX5EQ8tGs8RFK\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Vite Plugin\"}]}]\n4b:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/config/plugins/electronegativity\",\"pathname\":\"config/plugins/electronegativity\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-MJ-yOuokeU_KZD7UeSL\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Electronegativity Plugin\"}]}]\n4c:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/config/plugins/auto-unpack-natives\",\"pathname\":\"config/plugins/auto-unpack-natives\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LCgrkHSTWkOnrPcmsO5\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Auto Unpack Native Modules Plugin\"}]}]\n4d:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/config/plugins/local-electron\",\"pathname\":\"config/plugins/local-electron\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBYV0rs2hBvxzopePZE\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Local Electron Plugin\"}]}]\n4e:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/config/plugins/fuses\",\"pathname\":\"config/plugins/fuses\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"PcqWQK1hiyMFtq9Yav3l\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Fuses Plugin\"}]}]\n4f:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/config/makers/appx\",\"pathname\":\"config/makers/appx\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBKKgueYwrTINMPZorJ\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"AppX\"}]}]\n50:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/config/makers/deb\",\"pathname\":\"config/makers/deb\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBKKq9Fv0zrD3QXdRZw\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"deb\"}]}]\n51:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/config/makers/dmg\",\"pathname\":\"config/makers/dmg\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBKKrVNqTMQxCAbe7cg\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"DMG\"}]}]\n52:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/config/makers/flatpak\",\"pathname\":\"config/makers/flatpak\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBKKsLb2Svi4Wb5dH1T\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Flatpak\"}]}]\n53:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L"])</script><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">self.__next_f.push([1,"48\",null,{\"href\":\"/config/makers/pkg\",\"pathname\":\"config/makers/pkg\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBOvSRC2ltIaWtHALQ5\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"pkg\"}]}]\n54:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/config/makers/rpm\",\"pathname\":\"config/makers/rpm\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBKKtTAWsepb9-pRZ6Z\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"RPM\"}]}]\n55:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/config/makers/snapcraft\",\"pathname\":\"config/makers/snapcraft\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBKKuuEGWccSmXtmw_7\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Snapcraft\"}]}]\n56:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/config/makers/squirrel.windows\",\"pathname\":\"config/makers/squirrel.windows\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBKKw2VVXqdPv8cIYn0\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Squirrel.Windows\"}]}]\n57:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/config/makers/wix-msi\",\"pathname\":\"config/makers/wix-msi\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBKKyCj_C8SL8ELAdEQ\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"WiX MSI\"}]}]\n58:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/config/makers/zip\",\"pathname\":\"config/makers/zip\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBKKyyOgS_yrgdbKiv7\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"ZIP\"}]}]\n59:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/config/publishers/bitbucket\",\"pathname\":\"config/publishers/bitbucket\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LMG31SH2kdoByRD7IwB\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Bitbucket\"}]}]\n5a:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/config/publishers/electron-release-server\",\"pathname\":\"config/publishers/electron-release-server\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBKL3Dk5c-TduJvKysz\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Electron Release Server\"}]}]\n5b:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/config/publishers/github\",\"pathname\":\"config/publishers/github\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBKL5Yh_3BRA-VPNh8M\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"GitHub\"}]}]\n5c:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/config/publishers/gcs\",\"pathname\":\"config/publishers/gcs\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"i50xi9tmx0PsM7lXrEA8\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Google Cloud Storage\"}]}]\n5d:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/config/publishers/nucleus\",\"pathname\":\"config/publishers/nucleus\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBZeyXfLXYMoMfWR-zt\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Nucleus\"}]}]\n5e:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/config/publishers/s3\",\"pathname\":\"config/publishers/s3\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBKL7VCIwWHSfX1_Sgf\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"S3\"}]}]\n5f:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/config/publishers/snapcraft\",\"pathname\":\"config/publishers/snapcraft\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBKL8gK24zfCbTE5QlE\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Snapcraft\"}]}]\n60:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/guides/code-"])</script><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">self.__next_f.push([1,"signing/code-signing-windows\",\"pathname\":\"guides/code-signing/code-signing-windows\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"HGU56ISuUKXRZZCXVYuj\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Signing a Windows app\"}]}]\n61:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/guides/code-signing/code-signing-macos\",\"pathname\":\"guides/code-signing/code-signing-macos\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"beYm0b6OoebesJ5rgg4R\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Signing a macOS app\"}]}]\n62:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/guides/framework-integration/react\",\"pathname\":\"guides/framework-integration/react\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-MRThcgpR_EG2lHXEFZW\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"React\"}]}]\n63:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/guides/framework-integration/react-with-typescript\",\"pathname\":\"guides/framework-integration/react-with-typescript\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-MOj112piADjftZrH2yI\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"React with TypeScript\"}]}]\n64:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/guides/framework-integration/vue-3\",\"pathname\":\"guides/framework-integration/vue-3\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"LEvXayS14hE8oOvpcGPB\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Vue 3\"}]}]\n65:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/advanced/extending-electron-forge/writing-plugins\",\"pathname\":\"advanced/extending-electron-forge/writing-plugins\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBKLEKKsOKl3X6HgkdR\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Writing Plugins\"}]}]\n66:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/advanced/extending-electron-forge/writing-templates\",\"pathname\":\"advanced/extending-electron-forge/writing-templates\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-MftyUMP6EDOaUhQD05b\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Writing Templates\"}]}]\n67:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/advanced/extending-electron-forge/writing-makers\",\"pathname\":\"advanced/extending-electron-forge/writing-makers\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBKLGgCuSdBG451fLkb\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Writing Makers\"}]}]\n68:[\"$\",\"li\",null,{\"className\":\"flex flex-col\",\"children\":[\"$\",\"$L48\",null,{\"href\":\"/advanced/extending-electron-forge/writing-publishers\",\"pathname\":\"advanced/extending-electron-forge/writing-publishers\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-LBKLISSIeKvlvFItgtW\"},\"position\":\"sidebar\"}},\"descendants\":null,\"children\":\"Writing Publishers\"}]}]\n6c:I[46451,[\"2622\",\"static/chunks/2622-d4284e72be418b70.js\",\"7609\",\"static/chunks/7609-5073804535dff38c.js\",\"2999\",\"static/chunks/2999-584f9b8ecc233405.js\",\"7993\",\"static/chunks/7993-8ef7f7477490b7af.js\",\"5572\",\"static/chunks/5572-d068cc2bc8e73d12.js\",\"5890\",\"static/chunks/5890-3ab2501336ce1348.js\",\"8843\",\"static/chunks/8843-f0d01ada04c351a9.js\",\"983\",\"static/chunks/983-4fad0180b495256f.js\",\"4055\",\"static/chunks/4055-7666845ca98fb1a4.js\",\"4168\",\"static/chunks/4168-0a5038a89c61b229.js\",\"4722\",\"static/chunks/app/middleware/(site)/(content)/%5B%5B...pathname%5D%5D/page-a1cb1652fa802fac.js\"],\"PreservePageLayout\"]\n6e:\"$Sreact.fragment\"\n70:I[58982,[\"2622\",\"static/chunks/2622-d4284e72be418b70.js\",\"7609\",\"static/chunks/7609-5073804535dff38c.js\",\"2999\",\"static/chunks/2999-584f9b8ecc233405.js\",\"7993\",\"static/chunks/7993-8ef7f7477490b7af.js\",\"5572\",\"static/chunks/5572-d068cc2bc8e73d12.js\",\"5890\",\"static/chunks/5890-3ab2501336ce1348.js\",\"8843\",\"static/chunks/8"])</script><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">self.__next_f.push([1,"843-f0d01ada04c351a9.js\",\"983\",\"static/chunks/983-4fad0180b495256f.js\",\"4055\",\"static/chunks/4055-7666845ca98fb1a4.js\",\"4168\",\"static/chunks/4168-0a5038a89c61b229.js\",\"4722\",\"static/chunks/app/middleware/(site)/(content)/%5B%5B...pathname%5D%5D/page-a1cb1652fa802fac.js\"],\"ClientCodeBlock\"]\n72:I[18742,[\"2622\",\"static/chunks/2622-d4284e72be418b70.js\",\"7609\",\"static/chunks/7609-5073804535dff38c.js\",\"2999\",\"static/chunks/2999-584f9b8ecc233405.js\",\"7993\",\"static/chunks/7993-8ef7f7477490b7af.js\",\"5572\",\"static/chunks/5572-d068cc2bc8e73d12.js\",\"5890\",\"static/chunks/5890-3ab2501336ce1348.js\",\"8843\",\"static/chunks/8843-f0d01ada04c351a9.js\",\"983\",\"static/chunks/983-4fad0180b495256f.js\",\"4055\",\"static/chunks/4055-7666845ca98fb1a4.js\",\"4168\",\"static/chunks/4168-0a5038a89c61b229.js\",\"4722\",\"static/chunks/app/middleware/(site)/(content)/%5B%5B...pathname%5D%5D/page-a1cb1652fa802fac.js\"],\"DynamicTabs\"]\n74:I[66819,[\"2622\",\"static/chunks/2622-d4284e72be418b70.js\",\"7609\",\"static/chunks/7609-5073804535dff38c.js\",\"2999\",\"static/chunks/2999-584f9b8ecc233405.js\",\"7993\",\"static/chunks/7993-8ef7f7477490b7af.js\",\"5890\",\"static/chunks/5890-3ab2501336ce1348.js\",\"3625\",\"static/chunks/3625-453944d6ea4368cb.js\",\"983\",\"static/chunks/983-4fad0180b495256f.js\",\"4055\",\"static/chunks/4055-7666845ca98fb1a4.js\",\"6119\",\"static/chunks/app/middleware/(site)/(content)/layout-1043f1693da1ab25.js\"],\"DateRelative\"]\n75:I[75632,[\"2622\",\"static/chunks/2622-d4284e72be418b70.js\",\"7609\",\"static/chunks/7609-5073804535dff38c.js\",\"2999\",\"static/chunks/2999-584f9b8ecc233405.js\",\"7993\",\"static/chunks/7993-8ef7f7477490b7af.js\",\"5572\",\"static/chunks/5572-d068cc2bc8e73d12.js\",\"5890\",\"static/chunks/5890-3ab2501336ce1348.js\",\"8843\",\"static/chunks/8843-f0d01ada04c351a9.js\",\"983\",\"static/chunks/983-4fad0180b495256f.js\",\"4055\",\"static/chunks/4055-7666845ca98fb1a4.js\",\"4168\",\"static/chunks/4168-0a5038a89c61b229.js\",\"4722\",\"static/chunks/app/middleware/(site)/(content)/%5B%5B...pathname%5D%5D/page-a1cb1652fa802fac.js\"],\"PageFeedbackForm\"]\n76:I[16643,[\"2622\",\"static/chunks/2622-d4284e72be418b70.js\",\"7609\",\"static/chunks/7609-5073804535dff38c.js\",\"2999\",\"static/chunks/2999-584f9b8ecc233405.js\",\"7993\",\"static/chunks/7993-8ef7f7477490b7af.js\",\"5572\",\"static/chunks/5572-d068cc2bc8e73d12.js\",\"5890\",\"static/chunks/5890-3ab2501336ce1348.js\",\"8843\",\"static/chunks/8843-f0d01ada04c351a9.js\",\"983\",\"static/chunks/983-4fad0180b495256f.js\",\"4055\",\"static/chunks/4055-7666845ca98fb1a4.js\",\"4168\",\"static/chunks/4168-0a5038a89c61b229.js\",\"4722\",\"static/chunks/app/middleware/(site)/(content)/%5B%5B...pathname%5D%5D/page-a1cb1652fa802fac.js\"],\"PageClientLayout\"]\n71:[\"page-api-block:ml-0\"]\ne:[null,[\"$\",\"div\",null,{\"className\":\"flex flex-row-reverse justify-end grow\",\"children\":[\"$L6b\",[[\"$\",\"main\",null,{\"className\":\"flex-1 relative py-8 lg:px-12 break-anywhere page-api-block:xl:max-2xl:pr-0 page-api-block:max-w-[1654px] page-api-block:mx-auto\",\"children\":[[\"$\",\"$L6c\",null,{\"asFullWidth\":false}],null,\"$L6d\",[\"$\",\"$24\",null,{\"fallback\":[\"$\",\"div\",null,{\"className\":\"flex flex-col gap-4\",\"children\":[[\"$\",\"div\",null,{\"id\":\"$undefined\",\"role\":\"status\",\"aria-busy\":true,\"className\":\"w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0\",\"children\":[\"$\",\"div\",null,{\"className\":\"ring-1 ring-tint-subtle overflow-hidden relative grid rounded-md h-[35px] [max-width:calc(48rem-1px)]\",\"children\":[\"$\",\"div\",null,{\"className\":\"w-full bg-tint grid grid-area-1-1 overflow-hidden [mask:conic-gradient(from_90deg_at_1px_1px,_#0000_90deg,_#0003_0)_calc(50%+1px)_calc(0%+47px)_/_12px_12px]\",\"children\":[\"$\",\"div\",null,{\"className\":\"aspect-square from-tint-solid to-transparent grid-area-1-1 relative origin-[50%_50%] top-[50%] self-stretch bg-transparent will-change-transform animate-[rotateLoop_2s_linear_infinite] [background-image:conic-gradient(from_-90deg_at_50%_50%,_var(--tw-gradient-stops)_0deg,_var(--tw-gradient-stops)_90deg,_var(--tw-gradient-stops)_280deg)]\"}]}]}]}],[\"$\",\"div\",null,{\"id\":\"$undefined\",\"role\":\"status\",\"aria-busy\":true,\"className\":\"skeleton-paragraph\",\"children\":[\"$\",\"div\",null,{\"className\":\"ring-1 ri"])</script><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">self.__next_f.push([1,"ng-tint-subtle overflow-hidden relative grid rounded-md [height:calc(15rem-1px)] [max-width:calc(48rem-1px)] w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0\",\"children\":[\"$\",\"div\",null,{\"className\":\"w-full bg-tint grid grid-area-1-1 overflow-hidden [mask:conic-gradient(from_90deg_at_1px_1px,_#0000_90deg,_#0003_0)_calc(50%+1px)_calc(0%+47px)_/_48px_48px]\",\"children\":[\"$\",\"div\",null,{\"className\":\"aspect-square from-tint-solid to-transparent grid-area-1-1 relative origin-[50%_50%] top-[50%] self-stretch bg-transparent will-change-transform animate-[rotateLoop_2s_linear_infinite] [background-image:conic-gradient(from_-90deg_at_50%_50%,_var(--tw-gradient-stops)_0deg,_var(--tw-gradient-stops)_90deg,_var(--tw-gradient-stops)_280deg)]\"}]}]}]}],[\"$\",\"div\",null,{\"id\":\"setting-up-the-app\",\"role\":\"status\",\"aria-busy\":true,\"className\":\"w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0\",\"children\":[\"$\",\"div\",null,{\"className\":\"ring-1 ring-tint-subtle overflow-hidden relative grid rounded-md h-[47px] [max-width:calc(48rem-1px)]\",\"children\":[\"$\",\"div\",null,{\"className\":\"w-full bg-tint grid grid-area-1-1 overflow-hidden [mask:conic-gradient(from_90deg_at_1px_1px,_#0000_90deg,_#0003_0)_calc(50%+1px)_calc(0%+47px)_/_12px_12px]\",\"children\":[\"$\",\"div\",null,{\"className\":\"aspect-square from-tint-solid to-transparent grid-area-1-1 relative origin-[50%_50%] top-[50%] self-stretch bg-transparent will-change-transform animate-[rotateLoop_2s_linear_infinite] [background-image:conic-gradient(from_-90deg_at_50%_50%,_var(--tw-gradient-stops)_0deg,_var(--tw-gradient-stops)_90deg,_var(--tw-gradient-stops)_280deg)]\"}]}]}]}],[\"$\",\"div\",null,{\"id\":\"$undefined\",\"role\":\"status\",\"aria-busy\":true,\"className\":\"w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0\",\"children\":[\"$\",\"div\",null,{\"className\":\"ring-1 ring-tint-subtle overflow-hidden relative grid rounded-md h-[35px] [max-width:calc(48rem-1px)]\",\"children\":[\"$\",\"div\",null,{\"className\":\"w-full bg-tint grid grid-area-1-1 overflow-hidden [mask:conic-gradient(from_90deg_at_1px_1px,_#0000_90deg,_#0003_0)_calc(50%+1px)_calc(0%+47px)_/_12px_12px]\",\"children\":[\"$\",\"div\",null,{\"className\":\"aspect-square from-tint-solid to-transparent grid-area-1-1 relative origin-[50%_50%] top-[50%] self-stretch bg-transparent will-change-transform animate-[rotateLoop_2s_linear_infinite] [background-image:conic-gradient(from_-90deg_at_50%_50%,_var(--tw-gradient-stops)_0deg,_var(--tw-gradient-stops)_90deg,_var(--tw-gradient-stops)_280deg)]\"}]}]}]}],[\"$\",\"div\",null,{\"id\":\"$undefined\",\"role\":\"status\",\"aria-busy\":true,\"className\":\"skeleton-paragraph\",\"children\":[\"$\",\"div\",null,{\"className\":\"ring-1 ring-tint-subtle overflow-hidden relative grid rounded-md [height:calc(15rem-1px)] [max-width:calc(48rem-1px)] w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0\",\"children\":[\"$\",\"div\",null,{\"className\":\"w-full bg-tint grid grid-area-1-1 overflow-hidden [mask:conic-gradient(from_90deg_at_1px_1px,_#0000_90deg,_#0003_0)_calc(50%+1px)_calc(0%+47px)_/_48px_48px]\",\"children\":[\"$\",\"div\",null,{\"className\":\"aspect-square from-tint-solid to-transparent grid-area-1-1 relative origin-[50%_50%] top-[50%] self-stretch bg-transparent will-change-transform animate-[rotateLoop_2s_linear_infinite] [background-image:conic-gradient(from_-90deg_at_50%_50%,_var(--tw-gradient-stops)_0deg,_var(--tw-gradient-stops)_90deg,_var(--tw-gradient-stops)_280deg)]\"}]}]}]}],[\"$\",\"div\",null,{\"id\":\"adding-dependencies\",\"role\":\"status\",\"aria-busy\":true,\"className\":\"w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0\",\"children\":[\"$\",\"div\",null,{\"className\":\"ring-1 ring-tint-subtle overflow-hidden relative grid rounded-md h-[47px] [max-width:calc(48rem-1px)]\",\"children\":[\"$\",\"div\",null,{\"className\":\"w-full bg-tint grid grid-area-1-1 overflow-hidden [mask:conic-gradient(from_90deg_at_1px_1px,_#0000_90deg,_#0003_0)_calc(50%+1px)_calc(0%+47px)_/_12px_12px]\",\"children\":[\"$\",\"div\",null,{\"className\":\"aspect-square from-tint-solid to-transparent grid-area-1-1 relative origin-[50%_50%] top-[50%] self-stretch "])</script><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">self.__next_f.push([1,"bg-transparent will-change-transform animate-[rotateLoop_2s_linear_infinite] [background-image:conic-gradient(from_-90deg_at_50%_50%,_var(--tw-gradient-stops)_0deg,_var(--tw-gradient-stops)_90deg,_var(--tw-gradient-stops)_280deg)]\"}]}]}]}],[\"$\",\"div\",null,{\"id\":\"$undefined\",\"role\":\"status\",\"aria-busy\":true,\"className\":\"w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0\",\"children\":[\"$\",\"div\",null,{\"className\":\"ring-1 ring-tint-subtle overflow-hidden relative grid rounded-md h-[35px] [max-width:calc(48rem-1px)]\",\"children\":[\"$\",\"div\",null,{\"className\":\"w-full bg-tint grid grid-area-1-1 overflow-hidden [mask:conic-gradient(from_90deg_at_1px_1px,_#0000_90deg,_#0003_0)_calc(50%+1px)_calc(0%+47px)_/_12px_12px]\",\"children\":[\"$\",\"div\",null,{\"className\":\"aspect-square from-tint-solid to-transparent grid-area-1-1 relative origin-[50%_50%] top-[50%] self-stretch bg-transparent will-change-transform animate-[rotateLoop_2s_linear_infinite] [background-image:conic-gradient(from_-90deg_at_50%_50%,_var(--tw-gradient-stops)_0deg,_var(--tw-gradient-stops)_90deg,_var(--tw-gradient-stops)_280deg)]\"}]}]}]}],[\"$\",\"div\",null,{\"id\":\"$undefined\",\"role\":\"status\",\"aria-busy\":true,\"className\":\"skeleton-paragraph\",\"children\":[\"$\",\"div\",null,{\"className\":\"ring-1 ring-tint-subtle overflow-hidden relative grid rounded-md [height:calc(15rem-1px)] [max-width:calc(48rem-1px)] w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0\",\"children\":[\"$\",\"div\",null,{\"className\":\"w-full bg-tint grid grid-area-1-1 overflow-hidden [mask:conic-gradient(from_90deg_at_1px_1px,_#0000_90deg,_#0003_0)_calc(50%+1px)_calc(0%+47px)_/_48px_48px]\",\"children\":[\"$\",\"div\",null,{\"className\":\"aspect-square from-tint-solid to-transparent grid-area-1-1 relative origin-[50%_50%] top-[50%] self-stretch bg-transparent will-change-transform animate-[rotateLoop_2s_linear_infinite] [background-image:conic-gradient(from_-90deg_at_50%_50%,_var(--tw-gradient-stops)_0deg,_var(--tw-gradient-stops)_90deg,_var(--tw-gradient-stops)_280deg)]\"}]}]}]}],[\"$\",\"div\",null,{\"id\":\"integrating-vue-3-code\",\"role\":\"status\",\"aria-busy\":true,\"className\":\"w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0\",\"children\":[\"$\",\"div\",null,{\"className\":\"ring-1 ring-tint-subtle overflow-hidden relative grid rounded-md h-[47px] [max-width:calc(48rem-1px)]\",\"children\":[\"$\",\"div\",null,{\"className\":\"w-full bg-tint grid grid-area-1-1 overflow-hidden [mask:conic-gradient(from_90deg_at_1px_1px,_#0000_90deg,_#0003_0)_calc(50%+1px)_calc(0%+47px)_/_12px_12px]\",\"children\":[\"$\",\"div\",null,{\"className\":\"aspect-square from-tint-solid to-transparent grid-area-1-1 relative origin-[50%_50%] top-[50%] self-stretch bg-transparent will-change-transform animate-[rotateLoop_2s_linear_infinite] [background-image:conic-gradient(from_-90deg_at_50%_50%,_var(--tw-gradient-stops)_0deg,_var(--tw-gradient-stops)_90deg,_var(--tw-gradient-stops)_280deg)]\"}]}]}]}],[\"$\",\"div\",null,{\"id\":\"$undefined\",\"role\":\"status\",\"aria-busy\":true,\"className\":\"w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0\",\"children\":[\"$\",\"div\",null,{\"className\":\"ring-1 ring-tint-subtle overflow-hidden relative grid rounded-md h-[35px] [max-width:calc(48rem-1px)]\",\"children\":[\"$\",\"div\",null,{\"className\":\"w-full bg-tint grid grid-area-1-1 overflow-hidden [mask:conic-gradient(from_90deg_at_1px_1px,_#0000_90deg,_#0003_0)_calc(50%+1px)_calc(0%+47px)_/_12px_12px]\",\"children\":[\"$\",\"div\",null,{\"className\":\"aspect-square from-tint-solid to-transparent grid-area-1-1 relative origin-[50%_50%] top-[50%] self-stretch bg-transparent will-change-transform animate-[rotateLoop_2s_linear_infinite] [background-image:conic-gradient(from_-90deg_at_50%_50%,_var(--tw-gradient-stops)_0deg,_var(--tw-gradient-stops)_90deg,_var(--tw-gradient-stops)_280deg)]\"}]}]}]}],[\"$\",\"div\",null,{\"id\":\"undefined\",\"role\":\"status\",\"aria-busy\":true,\"className\":\"skeleton-paragraph\",\"children\":[\"$\",\"div\",null,{\"className\":\"ring-1 ring-tint-subtle overflow-hidden relative grid rounded-md [height:calc(15rem-1px)] [max-width:calc(48rem-1px)] w-full mx-auto decoration-prim"])</script><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">self.__next_f.push([1,"ary/6 max-w-3xl page-api-block:ml-0\",\"children\":[\"$\",\"div\",null,{\"className\":\"w-full bg-tint grid grid-area-1-1 overflow-hidden [mask:conic-gradient(from_90deg_at_1px_1px,_#0000_90deg,_#0003_0)_calc(50%+1px)_calc(0%+47px)_/_48px_48px]\",\"children\":[\"$\",\"div\",null,{\"className\":\"aspect-square from-tint-solid to-transparent grid-area-1-1 relative origin-[50%_50%] top-[50%] self-stretch bg-transparent will-change-transform animate-[rotateLoop_2s_linear_infinite] [background-image:conic-gradient(from_-90deg_at_50%_50%,_var(--tw-gradient-stops)_0deg,_var(--tw-gradient-stops)_90deg,_var(--tw-gradient-stops)_280deg)]\"}]}]}]}]]}],\"children\":[\"$\",\"div\",null,{\"className\":\"[\u0026\u003e*+*]:mt-5 grid whitespace-pre-wrap\",\"children\":[[\"$\",\"p\",null,{\"className\":\"w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0\",\"children\":[[[\"$\",\"$6e\",\"0\",{\"children\":\"Vue 3 can be added to Electron Forge's Vite template with a few setup steps.\"}]]]}],[\"$\",\"div\",null,{\"className\":\"hint p-4 transition-colors rounded-md straight-corners:rounded-none bg-tint print-mode:!bg-tint theme-muted:bg-tint-base theme-bold-tint:bg-tint-base theme-gradient:bg-tint-12/1 border-tint [\u0026_.can-override-bg]:bg-tint-active [\u0026_.can-override-text]:text-tint-strong w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0\",\"children\":[\"$\",\"div\",null,{\"className\":\"flex flex-row\",\"children\":[[\"$\",\"$L44\",null,{\"icon\":\"circle-info\",\"className\":\"size-5 mr-4 mt-0.5 leading-normal text-primary\"}],[\"$\",\"div\",null,{\"className\":\"flex-1 space-y-4 [\u0026_.hint]:border [\u0026_pre]:border\",\"children\":[[\"$\",\"p\",null,{\"className\":\"w-full mx-auto decoration-primary/6 max-w-3xl [\u0026_a]:text-primary [\u0026_a:hover]:text-primary-strong flip-heading-hash\",\"children\":[[[\"$\",\"$6e\",\"0\",{\"children\":\"The following guide has been tested with Vue 3 and Vite 4.\"}]]]}]]}]]}]}],[\"$\",\"h2\",null,{\"id\":\"setting-up-the-app\",\"className\":\"text-3xl font-semibold heading group relative grid w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0\",\"children\":[[\"$\",\"div\",null,{\"className\":\"grid grid-area-1-1 relative -ml-6 w-7 border-0 opacity-0 group-hover:opacity-[0] group-focus:opacity-[0] md:group-hover:md:opacity-[1] md:group-focus:md:opacity-[1] mt-[1em]\",\"children\":[\"$\",\"a\",null,{\"href\":\"#setting-up-the-app\",\"aria-label\":\"Direct link to heading\",\"className\":\"inline-flex h-full items-start dark:shadow-none dark:ring-0 leading-tight\",\"children\":[\"$\",\"$L44\",null,{\"icon\":\"hashtag\",\"className\":\"w-3.5 h-[1lh] transition-colors text-transparent group-hover:text-tint-subtle contrast-more:group-hover:text-tint-strong lg:w-4\"}]}]}],[\"$\",\"div\",null,{\"className\":\"grid-area-1-1 z-[1] justify-self-start text-left leading-tight mt-[1em]\",\"children\":[[[\"$\",\"$6e\",\"0\",{\"children\":\"Setting up the app\"}]]]}]]}],[\"$\",\"p\",null,{\"className\":\"w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0\",\"children\":[[[\"$\",\"$6e\",\"0\",{\"children\":\"Create an Electron app using Electron Forge's \"}]],\"$L6f\",[[\"$\",\"$6e\",\"0\",{\"children\":\" template.\"}]]]}],[\"$\",\"$L70\",null,{\"block\":{\"object\":\"block\",\"type\":\"code\",\"isVoid\":false,\"data\":{\"syntax\":\"bash\"},\"nodes\":[{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\"npx create-electron-app@latest my-vue-app --template=vite\",\"marks\":[]}],\"key\":\"28d0af0f7d57467ba35b8c4cf711726c\"}],\"key\":\"a2bdda2ca661463f9a62dcc869b47e4b\"}],\"key\":\"f545eee93d26483f91e44ada89efb901\"},\"style\":[\"w-full mx-auto decoration-primary/6\",\"max-w-3xl\",[\"page-api-block:ml-0\"]],\"inlines\":[]}],[\"$\",\"h2\",null,{\"id\":\"adding-dependencies\",\"className\":\"text-3xl font-semibold heading group relative grid w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0\",\"children\":[[\"$\",\"div\",null,{\"className\":\"grid grid-area-1-1 relative -ml-6 w-7 border-0 opacity-0 group-hover:opacity-[0] group-focus:opacity-[0] md:group-hover:md:opacity-[1] md:group-focus:md:opacity-[1] mt-[1em]\",\"children\":[\"$\",\"a\",null,{\"href\":\"#adding-dependencies\",\"aria-label\":\"Direct link to heading\",\"className\":\"inline-flex h-full items-start dark:shadow-none dark:ring-0 leadin"])</script><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">self.__next_f.push([1,"g-tight\",\"children\":[\"$\",\"$L44\",null,{\"icon\":\"hashtag\",\"className\":\"w-3.5 h-[1lh] transition-colors text-transparent group-hover:text-tint-subtle contrast-more:group-hover:text-tint-strong lg:w-4\"}]}]}],[\"$\",\"div\",null,{\"className\":\"grid-area-1-1 z-[1] justify-self-start text-left leading-tight mt-[1em]\",\"children\":[[[\"$\",\"$6e\",\"0\",{\"children\":\"Adding dependencies\"}]]]}]]}],[\"$\",\"p\",null,{\"className\":\"w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0\",\"children\":[[[\"$\",\"$6e\",\"0\",{\"children\":\"Add the \"}],[\"$\",\"$6e\",\"1\",{\"children\":[\"$\",\"code\",null,{\"className\":\"py-[1px] px-1.5 min-w-[1.625rem] justify-center items-center ring-1 ring-inset ring-tint bg-tint rounded text-[.875em] leading-[calc(max(1.20em,1.25rem))]\",\"children\":\"vue\"}]}],[\"$\",\"$6e\",\"2\",{\"children\":\" npm package to your \"}],[\"$\",\"$6e\",\"3\",{\"children\":[\"$\",\"code\",null,{\"className\":\"py-[1px] px-1.5 min-w-[1.625rem] justify-center items-center ring-1 ring-inset ring-tint bg-tint rounded text-[.875em] leading-[calc(max(1.20em,1.25rem))]\",\"children\":\"dependencies\"}]}],[\"$\",\"$6e\",\"4\",{\"children\":\" and the \"}],[\"$\",\"$6e\",\"5\",{\"children\":[\"$\",\"code\",null,{\"className\":\"py-[1px] px-1.5 min-w-[1.625rem] justify-center items-center ring-1 ring-inset ring-tint bg-tint rounded text-[.875em] leading-[calc(max(1.20em,1.25rem))]\",\"children\":\"@vitejs/plugin-vue\"}]}],[\"$\",\"$6e\",\"6\",{\"children\":\" package to your \"}],[\"$\",\"$6e\",\"7\",{\"children\":[\"$\",\"code\",null,{\"className\":\"py-[1px] px-1.5 min-w-[1.625rem] justify-center items-center ring-1 ring-inset ring-tint bg-tint rounded text-[.875em] leading-[calc(max(1.20em,1.25rem))]\",\"children\":\"devDependencies\"}]}],[\"$\",\"$6e\",\"8\",{\"children\":\":\"}]]]}],[\"$\",\"$L70\",null,{\"block\":{\"object\":\"block\",\"type\":\"code\",\"isVoid\":false,\"data\":{\"syntax\":\"bash\"},\"nodes\":[{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\"npm install vue\",\"marks\":[]}],\"key\":\"2fa96734e7be41c081b6d0aee4e1b486\"}],\"key\":\"3d35c760fe894ff0bc9fd723160b07e6\"},{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\"npm install --save-dev @vitejs/plugin-vue\",\"marks\":[]}],\"key\":\"7b092e0b1cf1489790141dc72f023c7f\"}],\"key\":\"00430a15a0024efdac9afcdd4ba76b36\"}],\"key\":\"cb2c1b62f2fc4f9aa436aa730215361d\"},\"style\":[\"w-full mx-auto decoration-primary/6\",\"max-w-3xl\",\"$71\"],\"inlines\":[]}],[\"$\",\"h2\",null,{\"id\":\"integrating-vue-3-code\",\"className\":\"text-3xl font-semibold heading group relative grid w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0\",\"children\":[[\"$\",\"div\",null,{\"className\":\"grid grid-area-1-1 relative -ml-6 w-7 border-0 opacity-0 group-hover:opacity-[0] group-focus:opacity-[0] md:group-hover:md:opacity-[1] md:group-focus:md:opacity-[1] mt-[1em]\",\"children\":[\"$\",\"a\",null,{\"href\":\"#integrating-vue-3-code\",\"aria-label\":\"Direct link to heading\",\"className\":\"inline-flex h-full items-start dark:shadow-none dark:ring-0 leading-tight\",\"children\":[\"$\",\"$L44\",null,{\"icon\":\"hashtag\",\"className\":\"w-3.5 h-[1lh] transition-colors text-transparent group-hover:text-tint-subtle contrast-more:group-hover:text-tint-strong lg:w-4\"}]}]}],[\"$\",\"div\",null,{\"className\":\"grid-area-1-1 z-[1] justify-self-start text-left leading-tight mt-[1em]\",\"children\":[[[\"$\",\"$6e\",\"0\",{\"children\":\"Integrating Vue 3 code\"}]]]}]]}],[\"$\",\"p\",null,{\"className\":\"w-full mx-auto decoration-primary/6 max-w-3xl page-api-block:ml-0\",\"children\":[[[\"$\",\"$6e\",\"0\",{\"children\":\"You should now be able to start using Vue components in your Electron app. The following is a very minimal example of how to start to add Vue 3 code:\"}]]]}],[\"$\",\"$L72\",null,{\"id\":\"e371e549b2024630b92a2def14eaad19\",\"tabs\":[{\"id\":\"src-index.html\",\"title\":\"src/index.html\"},{\"id\":\"src-app.vue\",\"title\":\"src/App.vue\"},{\"id\":\"src-renderer.js\",\"title\":\"src/renderer.js\"},{\"id\":\"vite.renderer.config.mjs\",\"title\":\"vite.renderer.config.mjs\"}],\"tabsBody\":[[\"$\",\"div\",null,{\"className\":\"w-full space-y-4\",\"children\":[[\"$\",\"p\",null,{\"className\":\"w-full mx-auto decoration-primary/6 max-w-3xl flip-heading-h"])</script><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">self.__next_f.push([1,"ash\",\"children\":[[[\"$\",\"$6e\",\"0\",{\"children\":\"Replace the contents of \"}],[\"$\",\"$6e\",\"1\",{\"children\":[\"$\",\"code\",null,{\"className\":\"py-[1px] px-1.5 min-w-[1.625rem] justify-center items-center ring-1 ring-inset ring-tint bg-tint rounded text-[.875em] leading-[calc(max(1.20em,1.25rem))]\",\"children\":\"src/index.html\"}]}],[\"$\",\"$6e\",\"2\",{\"children\":\" with a \"}],[\"$\",\"$6e\",\"3\",{\"children\":[\"$\",\"code\",null,{\"className\":\"py-[1px] px-1.5 min-w-[1.625rem] justify-center items-center ring-1 ring-inset ring-tint bg-tint rounded text-[.875em] leading-[calc(max(1.20em,1.25rem))]\",\"children\":\"\u003cdiv\u003e\"}]}],[\"$\",\"$6e\",\"4\",{\"children\":\" element with the \"}],[\"$\",\"$6e\",\"5\",{\"children\":[\"$\",\"code\",null,{\"className\":\"py-[1px] px-1.5 min-w-[1.625rem] justify-center items-center ring-1 ring-inset ring-tint bg-tint rounded text-[.875em] leading-[calc(max(1.20em,1.25rem))]\",\"children\":\"#app\"}]}],[\"$\",\"$6e\",\"6\",{\"children\":\" id attribute.\"}]]]}],[\"$\",\"$L70\",null,{\"block\":{\"object\":\"block\",\"type\":\"code\",\"isVoid\":false,\"data\":{\"syntax\":\"html\"},\"nodes\":[{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\"\u003c!DOCTYPE html\u003e\",\"marks\":[]}],\"key\":\"7ef806cb908a48b0a6093c943bd4be61\"}],\"key\":\"dad72e6bc533493f987a2a334f578dd6\"},{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\"\u003chtml\u003e\",\"marks\":[]}],\"key\":\"34a3dee7d7fb4a878fb61421fdd0892a\"}],\"key\":\"5bf76482c9404a5cb9c08bccbaba2348\"},{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\" \u003chead\u003e\",\"marks\":[]}],\"key\":\"50b8d161a04048ce8ce94bd8d664ba45\"}],\"key\":\"228124f3b32348aa9d4147914b09f1f0\"},{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\" \u003cmeta charset=\\\"UTF-8\\\" /\u003e\",\"marks\":[]}],\"key\":\"cd7831614ea44e02b88d63cc229eb8b6\"}],\"key\":\"2a54d7a7083b483ca92ec2bbcb2b2bfc\"},{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\" \u003ctitle\u003eHello World!\u003c/title\u003e\",\"marks\":[]}],\"key\":\"97424c3a6b834fe18b5c4083936f5ea8\"}],\"key\":\"aa46632186094ec986a5744aebc552e8\"},{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\" \u003c/head\u003e\",\"marks\":[]}],\"key\":\"71bc071ec40f4abe8aec5b6cc87f7b5b\"}],\"key\":\"bb19b9bf00044ce98d52b9e164b1c20e\"},{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\" \u003cbody\u003e\",\"marks\":[]}],\"key\":\"67215377a7bb4b8f98a2a240c333b51e\"}],\"key\":\"dfe97218b1e34a378bc692475ade276d\"},{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\" \u003cdiv id=\\\"app\\\"\u003e\u003c/div\u003e\",\"marks\":[]}],\"key\":\"02e6c4bad2db41e3943d7711164b4576\"}],\"key\":\"6cc4f97a74c845c08609c8984f7fade0\"},{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\" \u003cscript type=\\\"module\\\" src=\\\"/src/renderer.js\\\"\u003e\u003c/script\u003e\",\"marks\":[]}],\"key\":\"e7dab73f5fcc4cd6a85d132fc1f903df\"}],\"key\":\"1f219a56843d4cce81b2432c1ab5b88f\"},{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\" \u003c/body\u003e\",\"marks\":[]}],\"key\":\"6c282d4414574c05a43d8ae1064a55a0\"}],\"key\":\"33101a91530f48f4ac9c646dd1c57d45\"},{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\"\u003c/html\u003e\",\"marks\":[]}],\"key\":\"868f61ac0aea40c9ad2b40364edde35e\"}],\"key\":\"0b1eb2125fdb4a90bf284ae7ce28e16b\"}],\"key\":\"4efa9bd554884d30a70231328a97077d\"},\"style\":[\"w-full mx-auto decoration-primary/6\",\"max-w-3xl\",\"flip-heading-hash\"],\"inlines\":[]}]]}],[\"$\",\"div\",null,{\"className\":\"w-full space-y-4\",\"children\":[[\"$\",\"p\",null,{\"className\":\"w-full mx-auto decoration-primary/6 max-w-3xl flip-heading-hash\",\"children\":[[[\"$\",\"$6e\",\"0\",{\"children\":\"Add the contents from the template back to \"}],[\"$\",\"$6e\""])</script><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">self.__next_f.push([1,",\"1\",{\"children\":[\"$\",\"code\",null,{\"className\":\"py-[1px] px-1.5 min-w-[1.625rem] justify-center items-center ring-1 ring-inset ring-tint bg-tint rounded text-[.875em] leading-[calc(max(1.20em,1.25rem))]\",\"children\":\"src/App.vue\"}]}],[\"$\",\"$6e\",\"2\",{\"children\":\".\"}]]]}],[\"$\",\"$L70\",null,{\"block\":{\"object\":\"block\",\"type\":\"code\",\"isVoid\":false,\"data\":{\"syntax\":\"vue\"},\"nodes\":[{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\"\u003ctemplate\u003e\",\"marks\":[]}],\"key\":\"08f2deb4a58c4c55b009b36ad1f1c383\"}],\"key\":\"b3f3c81b56074ccc90ed0aab2e8fb7b3\"},{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\" \u003ch1\u003e馃挅 Hello World!\u003c/h1\u003e\",\"marks\":[]}],\"key\":\"90a74619cc00419f8a68b922ada026aa\"}],\"key\":\"6e307d4754284dcfa634acce7bec07be\"},{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\" \u003cp\u003eWelcome to your Electron application.\u003c/p\u003e\",\"marks\":[]}],\"key\":\"4bae54bcc8b54f98a8176d50855dbfe4\"}],\"key\":\"af127573cac8446c94271d14c6706788\"},{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\"\u003c/template\u003e\",\"marks\":[]}],\"key\":\"9687961a06d34a348afec31f2d2f0994\"}],\"key\":\"38ef0de63eef47b09d1dd96bedf28cb2\"},{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\"\",\"marks\":[]}],\"key\":\"5f0a7e32a1a7433cbce67c8c76ad8ab5\"}],\"key\":\"9dd38d3d7abd4fa894c73b947fd32b02\"},{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\"\u003cscript setup\u003e\",\"marks\":[]}],\"key\":\"5def3f0c412247faa2b226c14e45e69a\"}],\"key\":\"93da8d9c61874cbe93241962aaaf5003\"},{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\"console.log('馃憢 This message is being logged by \\\"App.vue\\\", included via Vite');\",\"marks\":[]}],\"key\":\"c5fa544b111f4ed3af7803130dcd7362\"}],\"key\":\"4e0e2de0d4664db485f2175464f421f0\"},{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\"\u003c/script\u003e\",\"marks\":[]}],\"key\":\"42bc90d3255c487db7410f8f2d00f724\"}],\"key\":\"bfb6f36d4701470696c81163efc86637\"}],\"key\":\"6e363938c0c945f9a5e21754dbd3172b\"},\"style\":[\"w-full mx-auto decoration-primary/6\",\"max-w-3xl\",\"flip-heading-hash\"],\"inlines\":[]}]]}],[\"$\",\"div\",null,{\"className\":\"w-full space-y-4\",\"children\":[[\"$\",\"$24\",null,{\"fallback\":[\"$\",\"div\",null,{\"id\":\"$undefined\",\"role\":\"status\",\"aria-busy\":true,\"className\":\"w-full mx-auto decoration-primary/6 max-w-3xl flip-heading-hash\",\"children\":[\"$\",\"div\",null,{\"className\":\"ring-1 ring-tint-subtle overflow-hidden relative grid rounded-md h-[35px] [max-width:calc(48rem-1px)]\",\"children\":[\"$\",\"div\",null,{\"className\":\"w-full bg-tint grid grid-area-1-1 overflow-hidden [mask:conic-gradient(from_90deg_at_1px_1px,_#0000_90deg,_#0003_0)_calc(50%+1px)_calc(0%+47px)_/_12px_12px]\",\"children\":[\"$\",\"div\",null,{\"className\":\"aspect-square from-tint-solid to-transparent grid-area-1-1 relative origin-[50%_50%] top-[50%] self-stretch bg-transparent will-change-transform animate-[rotateLoop_2s_linear_infinite] [background-image:conic-gradient(from_-90deg_at_50%_50%,_var(--tw-gradient-stops)_0deg,_var(--tw-gradient-stops)_90deg,_var(--tw-gradient-stops)_280deg)]\"}]}]}]}],\"children\":[\"$\",\"p\",null,{\"className\":\"w-full mx-auto decoration-primary/6 max-w-3xl flip-heading-hash\",\"children\":[[[\"$\",\"$6e\",\"0\",{\"children\":\"Mount \"}],[\"$\",\"$6e\",\"1\",{\"children\":[\"$\",\"code\",null,{\"className\":\"py-[1px] px-1.5 min-w-[1.625rem] justify-center items-center ring-1 ring-inset ring-tint bg-tint rounded text-[.875em] leading-[calc(max(1.20em,1.25rem))]\",\"children\":\"App.vue\"}]}],[\"$\",\"$6e\",\"2\",{\"children\":\" into the DOM with Vue's \"}],[\"$\",\"$6e\",\"3\",{\"children\":[\"$\",\"code\",null,{\"className\":\"py-[1px] px-1.5 min-w-[1.625rem] justify-center items-center ring-1 ring-inset ring-tint bg-tint rounded text-[.875em] "])</script><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">self.__next_f.push([1,"leading-[calc(max(1.20em,1.25rem))]\",\"children\":\"createApp\"}]}],[\"$\",\"$6e\",\"4\",{\"children\":\" API.\"}]]]}]}],[\"$\",\"$24\",null,{\"fallback\":[\"$\",\"div\",null,{\"id\":\"$undefined\",\"role\":\"status\",\"aria-busy\":true,\"className\":\"skeleton-paragraph\",\"children\":[\"$\",\"div\",null,{\"className\":\"ring-1 ring-tint-subtle overflow-hidden relative grid rounded-md [height:calc(15rem-1px)] [max-width:calc(48rem-1px)] w-full mx-auto decoration-primary/6 max-w-3xl flip-heading-hash\",\"children\":[\"$\",\"div\",null,{\"className\":\"w-full bg-tint grid grid-area-1-1 overflow-hidden [mask:conic-gradient(from_90deg_at_1px_1px,_#0000_90deg,_#0003_0)_calc(50%+1px)_calc(0%+47px)_/_48px_48px]\",\"children\":[\"$\",\"div\",null,{\"className\":\"aspect-square from-tint-solid to-transparent grid-area-1-1 relative origin-[50%_50%] top-[50%] self-stretch bg-transparent will-change-transform animate-[rotateLoop_2s_linear_infinite] [background-image:conic-gradient(from_-90deg_at_50%_50%,_var(--tw-gradient-stops)_0deg,_var(--tw-gradient-stops)_90deg,_var(--tw-gradient-stops)_280deg)]\"}]}]}]}],\"children\":[\"$\",\"$L70\",null,{\"block\":{\"object\":\"block\",\"type\":\"code\",\"isVoid\":false,\"data\":{\"syntax\":\"javascript\"},\"nodes\":[{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\"import { createApp } from 'vue';\",\"marks\":[]}],\"key\":\"5d1252ac8eb645b5a08b2a47b416765b\"}],\"key\":\"36eb271c4903436eb12eaeb5bddf1d91\"},{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\"import App from './App.vue';\",\"marks\":[]}],\"key\":\"b6e9a60309be4e038130be1e50d8806b\"}],\"key\":\"71c00ed6c5f74518a06f1db31084c432\"},{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\"\",\"marks\":[]}],\"key\":\"7367dec61ece4d8aa0364ee3b7a9ecc9\"}],\"key\":\"b708ee15a7f34694a7913c94a556a41b\"},{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\"createApp(App).mount('#app');\",\"marks\":[]}],\"key\":\"f36c3c2275f0470dab18c67123be981f\"}],\"key\":\"6e0cfbadf88b4d04a3957e7d958ac62c\"}],\"key\":\"d6171b4961fd4aa4a07651e816a4ddf8\"},\"style\":[\"w-full mx-auto decoration-primary/6\",\"max-w-3xl\",\"flip-heading-hash\"],\"inlines\":[]}]}]]}],[\"$\",\"div\",null,{\"className\":\"w-full space-y-4\",\"children\":[[\"$\",\"$24\",null,{\"fallback\":[\"$\",\"div\",null,{\"id\":\"$undefined\",\"role\":\"status\",\"aria-busy\":true,\"className\":\"w-full mx-auto decoration-primary/6 max-w-3xl flip-heading-hash\",\"children\":[\"$\",\"div\",null,{\"className\":\"ring-1 ring-tint-subtle overflow-hidden relative grid rounded-md h-[35px] [max-width:calc(48rem-1px)]\",\"children\":[\"$\",\"div\",null,{\"className\":\"w-full bg-tint grid grid-area-1-1 overflow-hidden [mask:conic-gradient(from_90deg_at_1px_1px,_#0000_90deg,_#0003_0)_calc(50%+1px)_calc(0%+47px)_/_12px_12px]\",\"children\":[\"$\",\"div\",null,{\"className\":\"aspect-square from-tint-solid to-transparent grid-area-1-1 relative origin-[50%_50%] top-[50%] self-stretch bg-transparent will-change-transform animate-[rotateLoop_2s_linear_infinite] [background-image:conic-gradient(from_-90deg_at_50%_50%,_var(--tw-gradient-stops)_0deg,_var(--tw-gradient-stops)_90deg,_var(--tw-gradient-stops)_280deg)]\"}]}]}]}],\"children\":[\"$\",\"p\",null,{\"className\":\"w-full mx-auto decoration-primary/6 max-w-3xl flip-heading-hash\",\"children\":[[[\"$\",\"$6e\",\"0\",{\"children\":\"Configure the Vue plugin for Vite.js.\"}]]]}]}],[\"$\",\"$24\",null,{\"fallback\":[\"$\",\"div\",null,{\"id\":\"$undefined\",\"role\":\"status\",\"aria-busy\":true,\"className\":\"skeleton-paragraph\",\"children\":[\"$\",\"div\",null,{\"className\":\"ring-1 ring-tint-subtle overflow-hidden relative grid rounded-md [height:calc(15rem-1px)] [max-width:calc(48rem-1px)] w-full mx-auto decoration-primary/6 max-w-3xl flip-heading-hash\",\"children\":[\"$\",\"div\",null,{\"className\":\"w-full bg-tint grid grid-area-1-1 overflow-hidden [mask:conic-gradient(from_90deg_at_1px_1px,_#0000_90deg,_#0003_0)_calc(50%+1px)_calc(0%+47px)_/_48px_48px]\",\"children\":[\"$\",\"div\",null,{\"className\":\"aspect-square from-tint-solid to-transparent grid"])</script><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">self.__next_f.push([1,"-area-1-1 relative origin-[50%_50%] top-[50%] self-stretch bg-transparent will-change-transform animate-[rotateLoop_2s_linear_infinite] [background-image:conic-gradient(from_-90deg_at_50%_50%,_var(--tw-gradient-stops)_0deg,_var(--tw-gradient-stops)_90deg,_var(--tw-gradient-stops)_280deg)]\"}]}]}]}],\"children\":[\"$\",\"$L70\",null,{\"block\":{\"object\":\"block\",\"type\":\"code\",\"isVoid\":false,\"data\":{\"syntax\":\"javascript\"},\"nodes\":[{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\"import { defineConfig } from 'vite';\",\"marks\":[]}],\"key\":\"6f232d6e99ff4e49b0e4bd1ee5e7dcf3\"}],\"key\":\"062b8fb2c2044dfe97e4f5bf4a07fde2\"},{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\"import vue from '@vitejs/plugin-vue';\",\"marks\":[]}],\"key\":\"b2368a85b2ae48ad877428249f2ac0a8\"}],\"key\":\"4ed6d7f822a948d596ec422385813984\"},{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\"\",\"marks\":[]}],\"key\":\"ca47c8cb1bf847c99243f78d320b0334\"}],\"key\":\"d9c4828a57004338a51d7c1b7078392a\"},{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\"// https://vitejs.dev/config\",\"marks\":[]}],\"key\":\"bbaa183a68434944b37ed2c9f7a14bb2\"}],\"key\":\"ca28c947f68846cc9275114e4a993fd3\"},{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\"export default defineConfig({\",\"marks\":[]}],\"key\":\"976a47a8be5f4cb3aaef51162e5df615\"}],\"key\":\"557aaf1d7806477c852e0524bd9938b6\"},{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\" plugins: [vue()]\",\"marks\":[]}],\"key\":\"a1bb6d7ba4c045dba98159b0ad807826\"}],\"key\":\"dabb3acfb6e24ee2ac68c1aab0b77053\"},{\"object\":\"block\",\"type\":\"code-line\",\"isVoid\":false,\"data\":{},\"nodes\":[{\"object\":\"text\",\"leaves\":[{\"object\":\"leaf\",\"text\":\"});\",\"marks\":[]}],\"key\":\"9a96d48dde894ffb8b328a5118ccd8ca\"}],\"key\":\"88620df3ff254813a869187806685dea\"}],\"key\":\"d3488cc4b133432bbf2289c1404473a3\"},\"style\":[\"w-full mx-auto decoration-primary/6\",\"max-w-3xl\",\"flip-heading-hash\"],\"inlines\":[]}]}]]}]],\"style\":[\"w-full mx-auto decoration-primary/6\",\"max-w-3xl\",\"$71\"]}]]}]}],\"$L73\",[\"$\",\"div\",null,{\"className\":\"flex flex-row flex-wrap gap-4 items-center mt-6 max-w-3xl mx-auto page-api-block:ml-0 text-tint contrast-more:text-tint-strong\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-sm mr-auto\",\"children\":[[[\"$\",\"$6e\",\"string-0\",{\"children\":\"Last updated \"}],[\"$\",\"$6e\",\"arg-0\",{\"children\":[\"$\",\"$L74\",null,{\"value\":\"2024-12-11T18:53:45.545Z\"}]}]],\"\"]}],[\"$\",\"$L75\",null,{\"className\":\"xl:hidden\",\"orientation\":\"horizontal\",\"pageId\":\"LEvXayS14hE8oOvpcGPB\"}]]}]]}],[\"$\",\"$L1f\",null,{\"pageId\":\"LEvXayS14hE8oOvpcGPB\",\"revisionId\":\"9RCb0iQnzhfbMBPfinU4\"}]]]}],[\"$\",\"$24\",null,{\"fallback\":null,\"children\":[\"$\",\"$L76\",null,{\"withSections\":false}]}]]\n15:[[\"$\",\"meta\",\"0\",{\"name\":\"viewport\",\"content\":\"width=device-width, initial-scale=1\"}],[\"$\",\"meta\",\"1\",{\"name\":\"color-scheme\",\"content\":\"light dark\"}],[\"$\",\"meta\",\"2\",{\"charSet\":\"utf-8\"}],[\"$\",\"title\",\"3\",{\"children\":\"Vue 3 | Electron Forge\"}],[\"$\",\"meta\",\"4\",{\"name\":\"description\",\"content\":\"How to create an Electron app with Vue and Electron Forge\"}],[\"$\",\"meta\",\"5\",{\"name\":\"generator\",\"content\":\"GitBook (f8d4c76)\"}],[\"$\",\"meta\",\"6\",{\"name\":\"robots\",\"content\":\"index, follow\"}],[\"$\",\"link\",\"7\",{\"rel\":\"canonical\",\"href\":\"https://www.electronforge.io/guides/framework-integration/vue-3\"}],[\"$\",\"meta\",\"8\",{\"property\":\"og:title\",\"content\":\"Vue 3 | Electron Forge\"}],[\"$\",\"meta\",\"9\",{\"property\":\"og:description\",\"content\":\"How to create an Electron app with Vue and Electron Forge\"}],[\"$\",\"meta\",\"10\",{\"property\":\"og:image\",\"content\":\"https://www.electronforge.io/~gitbook/ogimage/LEvXayS14hE8oOvpcGPB\"}],[\"$\",\"meta\",\"11\",{\"name\":\"twitter:card\",\"content\":\"summary_large_image\"}],[\"$\",\"meta\",\"12\",{\"name\":\"twitter:title\",\"content\":\"Vue 3 | Electron Forge\"}],[\"$\",\"meta\","])</script><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">self.__next_f.push([1,"\"13\",{\"name\":\"twitter:description\",\"content\":\"How to create an Electron app with Vue and Electron Forge\"}],[\"$\",\"meta\",\"14\",{\"name\":\"twitter:image\",\"content\":\"https://www.electronforge.io/~gitbook/ogimage/LEvXayS14hE8oOvpcGPB\"}],[\"$\",\"link\",\"15\",{\"rel\":\"icon\",\"href\":\"https://2355537583-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LBKK1y7h_XWAtuRJG9X-4037718589%2Ficon%2FzSCYXfXdUPvs7AL9g6NO%2FElectron_Software_Framework_Logo.svg%20(1).png?alt=media\u0026token=325f86f6-2e2a-4d0f-a8c7-b28d4eea56a4\",\"type\":\"image/png\",\"media\":\"(prefers-color-scheme: light)\"}],[\"$\",\"link\",\"16\",{\"rel\":\"icon\",\"href\":\"https://2355537583-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LBKK1y7h_XWAtuRJG9X-4037718589%2Ficon%2FzSCYXfXdUPvs7AL9g6NO%2FElectron_Software_Framework_Logo.svg%20(1).png?alt=media\u0026token=325f86f6-2e2a-4d0f-a8c7-b28d4eea56a4\",\"type\":\"image/png\",\"media\":\"(prefers-color-scheme: dark)\"}],[\"$\",\"meta\",\"17\",{\"name\":\"next-size-adjust\"}]]\nd:null\n78:I[2554,[\"2622\",\"static/chunks/2622-d4284e72be418b70.js\",\"7609\",\"static/chunks/7609-5073804535dff38c.js\",\"2999\",\"static/chunks/2999-584f9b8ecc233405.js\",\"7993\",\"static/chunks/7993-8ef7f7477490b7af.js\",\"5572\",\"static/chunks/5572-d068cc2bc8e73d12.js\",\"5890\",\"static/chunks/5890-3ab2501336ce1348.js\",\"8843\",\"static/chunks/8843-f0d01ada04c351a9.js\",\"983\",\"static/chunks/983-4fad0180b495256f.js\",\"4055\",\"static/chunks/4055-7666845ca98fb1a4.js\",\"4168\",\"static/chunks/4168-0a5038a89c61b229.js\",\"4722\",\"static/chunks/app/middleware/(site)/(content)/%5B%5B...pathname%5D%5D/page-a1cb1652fa802fac.js\"],\"Ad\"]\n6b:[\"$\",\"aside\",null,{\"className\":\"group/aside hidden xl:flex flex-col basis-56 grow-0 shrink-0 break-anywhere text-tint contrast-more:text-tint-strong sticky lg:top-0 lg:max-h-screen site-header:lg:top-16 site-header:lg:max-h-[calc(100vh_-_4rem)] site-header-sections:lg:top-[6.75rem] site-header-sections:lg:max-h-[calc(100vh_-_6.75rem)] page-api-block:xl:max-2xl:z-10 page-api-block:xl:max-2xl:fixed page-api-block:xl:max-2xl:right-8 page-api-block:xl:max-2xl:w-56 page-api-block:xl:max-2xl:bg-tint/9 page-api-block:xl:max-2xl:contrast-more:bg-tint page-api-block:xl:max-2xl:backdrop-blur-lg page-api-block:xl:max-2xl:border page-api-block:xl:max-2xl:border-tint page-api-block:xl:max-2xl:hover:shadow-lg page-api-block:xl:max-2xl:hover:shadow-tint-12/1 page-api-block:xl:max-2xl:dark:hover:shadow-tint-1/1 page-api-block:xl:max-2xl:rounded-md page-api-block:xl:max-2xl:h-auto page-api-block:xl:max-2xl:my-8 page-api-block:p-2\",\"children\":[[[\"$\",\"div\",null,{\"className\":\"hidden page-api-block:xl:max-2xl:flex text-xs tracking-wide font-semibold uppercase flex-row items-center gap-2\",\"children\":[[\"$\",\"$L44\",null,{\"icon\":\"block-quote\",\"className\":\"size-3\"}],\"On this page\",[\"$\",\"$L44\",null,{\"icon\":\"chevron-down\",\"className\":\"size-3 opacity-6 ml-auto page-api-block:xl:max-2xl:group-hover/aside:hidden\"}]]}],[\"$\",\"div\",null,{\"className\":\"overflow-y-auto overflow-x-visible flex flex-col shrink pb-12 sticky lg:top:0 site-header:lg:top-16 site-header-sections:lg:top-[6.75rem] gap-6 pt-8 page-api-block:xl:max-2xl:py-0 page-api-block:xl:max-2xl:hidden page-api-block:xl:max-2xl:group-hover/aside:flex\",\"children\":[[\"$\",\"$24\",null,{\"fallback\":null,\"children\":\"$L77\"}],[\"$\",\"div\",null,{\"className\":\"flex flex-col gap-3 sidebar-list-default:px-3 border-t first:border-none border-tint-subtle py-4 first:pt-0 page-api-block:xl:max-2xl:px-3 empty:hidden\",\"children\":[[\"$\",\"$24\",null,{\"fallback\":null,\"children\":[\"$\",\"$L75\",null,{\"pageId\":\"LEvXayS14hE8oOvpcGPB\",\"className\":\"mt-2\"}]}],[\"$\",\"div\",null,{\"children\":[\"$\",\"a\",null,{\"href\":\"https://github.com/electron-forge/electron-forge-docs/blob/v6/guides/framework-integration/vue-3.md\",\"className\":\"flex flex-row items-center text-sm hover:text-tint-strong py-2\",\"children\":[[\"$\",\"$L44\",null,{\"icon\":\"github\",\"className\":\"size-4 mr-1.5\"}],\"Edit on GitHub\"]}]}],null]}]]}]],[\"$\",\"div\",null,{\"className\":\"pb-4 sticky bottom-0 bg-tint-base theme-muted:bg-tint-subtle theme-bold-tint:bg-tint-subtle theme-gradient:bg-gradient-primary theme-gradient-tint:bg-gradient-t"])</script><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">self.__next_f.push([1,"int z-10 mt-auto flex flex-col page-api-block:xl:max-2xl:pb-0 page-api-block:xl:max-2xl:hidden page-api-block:xl:max-2xl:group-hover/aside:flex page-api-block:xl:max-2xl:bg-transparent\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-end mt-4\",\"children\":[\"$\",\"$24\",null,{\"fallback\":null,\"children\":[\"$\",\"$L45\",null,{}]}]}],[\"$\",\"$L78\",null,{\"zoneId\":null,\"placement\":\"aside\",\"spaceId\":\"-LBKK1y7h_XWAtuRJG9X-4037718589\",\"siteAdsStatus\":\"$undefined\",\"ignore\":false,\"style\":\"$undefined\"}]]}]]}]\n6f:[\"$\",\"$L43\",null,{\"href\":\"/templates/vite\",\"className\":\"underline underline-offset-2 text-primary-subtle hover:text-primary contrast-more:text-primary contrast-more:hover:text-primary-strong transition-colors\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"YznJeGk6XHIbSeBSsxAl\"},\"position\":\"content\"}},\"children\":[[[\"$\",\"$6e\",\"0\",{\"children\":\"Vite\"}]]]}]\n6d:[\"$\",\"header\",null,{\"className\":\"max-w-3xl mx-auto mb-6 space-y-3 page-api-block:ml-0\",\"children\":[[\"$\",\"nav\",null,{\"children\":[\"$\",\"ol\",null,{\"className\":\"flex flex-wrap items-center gap-2\",\"children\":[[\"$\",\"$6e\",\"-MOj112oHkndmntvnXQV\",{\"children\":[[\"$\",\"li\",\"-MOj112oHkndmntvnXQV\",{\"children\":[\"$\",\"$L43\",null,{\"href\":\"/guides\",\"children\":[\"$undefined\",\"Guides\"],\"className\":\"underline-offset-2 decoration-primary/6 text-primary-subtle hover:text-primary contrast-more:text-primary contrast-more:hover:text-primary-strong transition-colors no-underline hover:underline text-xs tracking-wide font-semibold uppercase flex items-center gap-1.5 contrast-more:underline contrast-more:decoration-current\"}]}],[\"$\",\"$L44\",null,{\"icon\":\"chevron-right\",\"className\":\"size-3 text-tint-subtle\"}]]}],[\"$\",\"$6e\",\"-MOjX8peUTSvcMJ6P2-0\",{\"children\":[[\"$\",\"li\",\"-MOjX8peUTSvcMJ6P2-0\",{\"children\":[\"$\",\"$L43\",null,{\"href\":\"/guides/framework-integration\",\"children\":[\"$undefined\",\"Framework Integration\"],\"className\":\"underline-offset-2 decoration-primary/6 text-primary-subtle hover:text-primary contrast-more:text-primary contrast-more:hover:text-primary-strong transition-colors no-underline hover:underline text-xs tracking-wide font-semibold uppercase flex items-center gap-1.5 contrast-more:underline contrast-more:decoration-current\"}]}],false]}]]}]}],[\"$\",\"h1\",null,{\"className\":\"text-4xl font-bold flex items-center gap-4\",\"children\":[\"$undefined\",\"Vue 3\"]}],[\"$\",\"p\",null,{\"className\":\"text-lg text-tint\",\"children\":\"How to create an Electron app with Vue and Electron Forge\"}]]}]\n79:T627,https://www.electronforge.io/~gitbook/image?url=https%3A%2F%2F2355537583-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252F-LBKK1y7h_XWAtuRJG9X-4037718589%252Ficon%252FzSCYXfXdUPvs7AL9g6NO%252FElectron_Software_Framework_Logo.svg%2520%281%29.png%3Falt%3Dmedia%26token%3D325f86f6-2e2a-4d0f-a8c7-b28d4eea56a4\u0026width=32\u0026dpr=1\u0026quality=100\u0026sign=2d940ca3\u0026sv=2 32w, https://www.electronforge.io/~gitbook/image?url=https%3A%2F%2F2355537583-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252F-LBKK1y7h_XWAtuRJG9X-4037718589%252Ficon%252FzSCYXfXdUPvs7AL9g6NO%252FElectron_Software_Framework_Logo.svg%2520%281%29.png%3Falt%3Dmedia%26token%3D325f86f6-2e2a-4d0f-a8c7-b28d4eea56a4\u0026width=32\u0026dpr=2\u0026quality=100\u0026sign=2d940ca3\u0026sv=2 64w, https://www.electronforge.io/~gitbook/image?url=https%3A%2F%2F2355537583-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252F-LBKK1y7h_XWAtuRJG9X-4037718589%252Ficon%252FzSCYXfXdUPvs7AL9g6NO%252FElectron_Software_Framework_Logo.svg%2520%281%29.png%3Falt%3Dmedia%26token%3D325f86f6-2e2a-4d0f-a8c7-b28d4eea56a4\u0026width=32\u0026dpr=3\u0026quality=100\u0026sign=2d940ca3\u0026sv=2 96w, https://www.electronforge.io/~gitbook/image?url=https%3A%2F%2F2355537583-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252F-LBKK1y7h_XWAtuRJG9X-4037718589%252Ficon%252FzSCYXfXdUPvs7AL9g6NO%252FElectron_Software_Framework_Logo.svg%2520%281%29.png%3Falt%3Dmedia%26token%3D325f86f6-2e2a-4d0f-a8c7-b28d4eea56a4\u0026width=32\u0026dpr=4\u0026quality=100\u0026sign=2d940ca3\u0026sv=2 128w69:[\"$\",\"img\",null,{\"alt\":\"\",\"style\":{\""])</script><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">self.__next_f.push([1,"aspectRatio\":\"1\"},\"loading\":\"$undefined\",\"fetchPriority\":\"high\",\"data-visual-test\":\"$undefined\",\"className\":\"block dark:hidden object-contain size-8\",\"src\":\"https://www.electronforge.io/~gitbook/image?url=https%3A%2F%2F2355537583-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252F-LBKK1y7h_XWAtuRJG9X-4037718589%252Ficon%252FzSCYXfXdUPvs7AL9g6NO%252FElectron_Software_Framework_Logo.svg%2520%281%29.png%3Falt%3Dmedia%26token%3D325f86f6-2e2a-4d0f-a8c7-b28d4eea56a4\u0026width=32\u0026dpr=4\u0026quality=100\u0026sign=2d940ca3\u0026sv=2\",\"srcSet\":\"$79\",\"sizes\":\"32px\",\"width\":1200,\"height\":1200}]\n7a:T627,https://www.electronforge.io/~gitbook/image?url=https%3A%2F%2F2355537583-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252F-LBKK1y7h_XWAtuRJG9X-4037718589%252Ficon%252FzSCYXfXdUPvs7AL9g6NO%252FElectron_Software_Framework_Logo.svg%2520%281%29.png%3Falt%3Dmedia%26token%3D325f86f6-2e2a-4d0f-a8c7-b28d4eea56a4\u0026width=32\u0026dpr=1\u0026quality=100\u0026sign=2d940ca3\u0026sv=2 32w, https://www.electronforge.io/~gitbook/image?url=https%3A%2F%2F2355537583-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252F-LBKK1y7h_XWAtuRJG9X-4037718589%252Ficon%252FzSCYXfXdUPvs7AL9g6NO%252FElectron_Software_Framework_Logo.svg%2520%281%29.png%3Falt%3Dmedia%26token%3D325f86f6-2e2a-4d0f-a8c7-b28d4eea56a4\u0026width=32\u0026dpr=2\u0026quality=100\u0026sign=2d940ca3\u0026sv=2 64w, https://www.electronforge.io/~gitbook/image?url=https%3A%2F%2F2355537583-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252F-LBKK1y7h_XWAtuRJG9X-4037718589%252Ficon%252FzSCYXfXdUPvs7AL9g6NO%252FElectron_Software_Framework_Logo.svg%2520%281%29.png%3Falt%3Dmedia%26token%3D325f86f6-2e2a-4d0f-a8c7-b28d4eea56a4\u0026width=32\u0026dpr=3\u0026quality=100\u0026sign=2d940ca3\u0026sv=2 96w, https://www.electronforge.io/~gitbook/image?url=https%3A%2F%2F2355537583-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252F-LBKK1y7h_XWAtuRJG9X-4037718589%252Ficon%252FzSCYXfXdUPvs7AL9g6NO%252FElectron_Software_Framework_Logo.svg%2520%281%29.png%3Falt%3Dmedia%26token%3D325f86f6-2e2a-4d0f-a8c7-b28d4eea56a4\u0026width=32\u0026dpr=4\u0026quality=100\u0026sign=2d940ca3\u0026sv=2 128w6a:[\"$\",\"img\",null,{\"alt\":\"\",\"style\":{\"aspectRatio\":\"1\"},\"loading\":\"lazy\",\"fetchPriority\":\"high\",\"data-visual-test\":\"$undefined\",\"className\":\"hidden dark:block object-contain size-8\",\"src\":\"https://www.electronforge.io/~gitbook/image?url=https%3A%2F%2F2355537583-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252F-LBKK1y7h_XWAtuRJG9X-4037718589%252Ficon%252FzSCYXfXdUPvs7AL9g6NO%252FElectron_Software_Framework_Logo.svg%2520%281%29.png%3Falt%3Dmedia%26token%3D325f86f6-2e2a-4d0f-a8c7-b28d4eea56a4\u0026width=32\u0026dpr=4\u0026quality=100\u0026sign=2d940ca3\u0026sv=2\",\"srcSet\":\"$7a\",\"sizes\":\"32px\",\"width\":1200,\"height\":1200}]\n73:[\"$\",\"div\",null,{\"className\":\"flex flex-col md:flex-row mt-6 gap-2 max-w-3xl mx-auto page-api-block:ml-0 text-tint\",\"children\":[[\"$\",\"$L43\",null,{\"href\":\"/guides/framework-integration/react-with-typescript\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-MOj112piADjftZrH2yI\"},\"position\":\"content\"}},\"className\":\"group text-sm p-2.5 flex gap-4 flex-1 flex-row-reverse items-center pl-4 border border-tint-subtle rounded straight-corners:rounded-none hover:border-primary text-pretty md:p-4 md:text-base\",\"children\":[[\"$\",\"span\",null,{\"className\":\"flex flex-col flex-1 text-right\",\"children\":[[\"$\",\"span\",null,{\"className\":\"text-xs\",\"children\":\"Previous\"}],[\"$\",\"span\",null,{\"className\":\"text-tint-strong group-hover:text-primary line-clamp-2\",\"children\":\"React with TypeScript\"}]]}],[\"$\",\"$L44\",null,{\"icon\":\"chevron-left\",\"className\":\"hidden size-4 text-tint-subtle contrast-more:text-tint-strong group-hover:text-primary md:block\"}]]}],[\"$\",\"$L43\",null,{\"href\":\"/guides/developing-with-wsl\",\"insights\":{\"type\":\"link_click\",\"link\":{\"target\":{\"kind\":\"page\",\"page\":\"-MTrbL7ai0uuoUvPiMz9\"},\"position\":\"content\"}},\"className\":\"group text-sm p-2.5 flex gap-4 flex-1 flex-row items-center pr-4 border border-tint-subtle rounded straight-corners:"])</script><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">self.__next_f.push([1,"rounded-none hover:border-primary text-pretty md:p-4 md:text-base\",\"children\":[[\"$\",\"span\",null,{\"className\":\"flex flex-col flex-1\",\"children\":[[\"$\",\"span\",null,{\"className\":\"text-xs\",\"children\":\"Next\"}],[\"$\",\"span\",null,{\"className\":\"text-tint-strong group-hover:text-primary line-clamp-2\",\"children\":\"Developing with WSL\"}]]}],[\"$\",\"$L44\",null,{\"icon\":\"chevron-right\",\"className\":\"hidden size-4 text-tint-subtle contrast-more:text-tint-strong group-hover:text-primary md:block\"}]]}]]}]\n7b:I[19522,[\"2622\",\"static/chunks/2622-d4284e72be418b70.js\",\"7609\",\"static/chunks/7609-5073804535dff38c.js\",\"2999\",\"static/chunks/2999-584f9b8ecc233405.js\",\"7993\",\"static/chunks/7993-8ef7f7477490b7af.js\",\"5572\",\"static/chunks/5572-d068cc2bc8e73d12.js\",\"5890\",\"static/chunks/5890-3ab2501336ce1348.js\",\"8843\",\"static/chunks/8843-f0d01ada04c351a9.js\",\"983\",\"static/chunks/983-4fad0180b495256f.js\",\"4055\",\"static/chunks/4055-7666845ca98fb1a4.js\",\"4168\",\"static/chunks/4168-0a5038a89c61b229.js\",\"4722\",\"static/chunks/app/middleware/(site)/(content)/%5B%5B...pathname%5D%5D/page-a1cb1652fa802fac.js\"],\"ScrollSectionsList\"]\n77:[\"$\",\"$L7b\",null,{\"sections\":[{\"id\":\"setting-up-the-app\",\"title\":\"Setting up the app\",\"depth\":1},{\"id\":\"adding-dependencies\",\"title\":\"Adding dependencies\",\"depth\":1},{\"id\":\"integrating-vue-3-code\",\"title\":\"Integrating Vue 3 code\",\"depth\":1}]}]\n"])</script><div hidden id="S:0"><ul class="sidebar-list-line:border-l border-tint-subtle"><li class="flex flex-row relative h-fit mt-2"><a href="#setting-up-the-app" class="relative flex flex-row items-baseline z-10 text-sm w-full py-1 px-3 transition-all duration-200 rounded-md straight-corners:rounded-none sidebar-list-line:rounded-l-none hover:bg-tint-hover theme-gradient:hover:bg-tint-12/1 hover:text-tint-strong contrast-more:hover:ring-1 contrast-more:hover:ring-inset contrast-more:hover:ring-current"><span class="">Setting up the app</span></a></li><li class="flex flex-row relative h-fit mt-2"><a href="#adding-dependencies" class="relative flex flex-row items-baseline z-10 text-sm w-full py-1 px-3 transition-all duration-200 rounded-md straight-corners:rounded-none sidebar-list-line:rounded-l-none hover:bg-tint-hover theme-gradient:hover:bg-tint-12/1 hover:text-tint-strong contrast-more:hover:ring-1 contrast-more:hover:ring-inset contrast-more:hover:ring-current"><span class="">Adding dependencies</span></a></li><li class="flex flex-row relative h-fit mt-2"><a href="#integrating-vue-3-code" class="relative flex flex-row items-baseline z-10 text-sm w-full py-1 px-3 transition-all duration-200 rounded-md straight-corners:rounded-none sidebar-list-line:rounded-l-none hover:bg-tint-hover theme-gradient:hover:bg-tint-12/1 hover:text-tint-strong contrast-more:hover:ring-1 contrast-more:hover:ring-inset contrast-more:hover:ring-current"><span class="">Integrating Vue 3 code</span></a></li></ul></div><script nonce="NGYwMTk4MWMtYzk2Zi00MDVmLTllMmMtYWNiNmVlZTFiYjUx">$RC=function(b,c,e){c=document.getElementById(c);c.parentNode.removeChild(c);var a=document.getElementById(b);if(a){b=a.previousSibling;if(e)b.data="$!",a.setAttribute("data-dgst",e);else{e=b.parentNode;a=b.nextSibling;var f=0;do{if(a&&8===a.nodeType){var d=a.data;if("/$"===d)if(0===f)break;else f--;else"$"!==d&&"$?"!==d&&"$!"!==d||f++}d=a.nextSibling;e.removeChild(a);a=d}while(a);for(;c.firstChild;)e.insertBefore(c.firstChild,a);b.data="$"}b._reactRetry&&b._reactRetry()}};$RC("B:0","S:0")</script></body></html>