@nuxt/devtools
Version:
<a href="https://devtools.nuxt.com"><img width="1200" alt="Nuxt DevTools" src="https://github-production-user-asset-6210df.s3.amazonaws.com/904724/261577617-a10567bd-ad33-48cc-9bda-9e37dbe1929f.png"></a> <br>
2 lines (1 loc) • 8.04 kB
JavaScript
import{d as j,a as V,r as S,o,m as u,k as e,F as f,n as E,D as F,f as i,t as v,p as w,E as U,i as m,j as d,v as y,G as D,H as I,I as q,J as R,K as G,_ as L,L as h,M as ee,N as ne,O as te,P as le,Q as ie,R as oe,S as re,U as k,h as B,l as P,V as se,W as ue,X as ae,y as de}from"./Bysyzw-g.js";import{_ as me}from"./CQTsRCSt.js";import{_ as pe}from"./CdlRa3-_.js";import{_ as fe}from"./ZTJOnUjs.js";import{_ as ve}from"./WFxqX3Wd.js";import"./DK4YETzW.js";const ye={"h-full":"",grid:"~ rows-[max-content_1fr]"},ce={flex:"~ wrap","w-full":""},be=["onClick"],xe={key:0,flex:"~ col gap-4 items-center justify-center",p4:""},ge={grid:"~ cols-[30px_1fr] gap-x-2 gap-y-3 items-center justify-center","w-100":""},we=j({__name:"BuildAnalyzeDetails",props:{current:{},prev:{}},setup(N){const c=N,$=`${q().app.baseURL}/__nuxt_devtools__/analyze/`.replace(/\/+/g,"/"),b=V(()=>{const l=[{name:"Overview",id:"overview"}];return c.current.features.bundleClient&&l.push({name:"Client Bundle",id:"bundle-client"}),c.current.features.bundleNitro&&l.push({name:"Nitro Bundle",id:"bundle-nitro"}),c.current.features.viteInspect&&l.push({name:"Vite Inspect",id:"vite-inspect"}),l}),s=S(b.value[0]);function x(l){return l<1024?`${l}B`:l<1024*1024?`${(l/1024).toFixed(1)}KB`:l<1024*1024*1024?`${(l/1024/1024).toFixed(1)}MB`:`${(l/1024/1024/1024).toFixed(1)}GB`}function p(l){return`${((l.endTime-l.startTime)/1e3).toFixed(1)}s`}async function T(l){return R.clearAnalyzeBuilds(await G(),[l])}return(l,n)=>{const C=me,A=L;return o(),u("div",ye,[e("div",ce,[(o(!0),u(f,null,E(i(b),(r,t)=>(o(),u("button",{key:t,px4:"",py2:"",border:"r base",hover:"bg-active",class:F(r.id===i(s).id?"":"border-b"),onClick:_=>s.value=r},[e("div",{class:F(r.id===i(s).id?"":"op30")},v(r.name),3)],10,be))),128)),n[1]||(n[1]=e("div",{border:"b base","flex-auto":""},null,-1))]),i(s).id==="overview"?(o(),u("div",xe,[n[15]||(n[15]=e("div",{"flex-auto":""},null,-1)),e("div",ge,[n[10]||(n[10]=e("div",{"i-carbon-commit":"","text-xl":""},null,-1)),e("div",null,[n[2]||(n[2]=e("div",{"text-sm":"",op50:""}," Name ",-1)),e("div",null,v(l.current.name),1)]),n[11]||(n[11]=e("div",{"i-carbon-time":"","text-xl":""},null,-1)),e("div",null,[n[3]||(n[3]=e("div",{"text-sm":"",op50:""}," Build duration ",-1)),e("div",null,v(p(l.current)),1)]),l.current.size?.clientBundle?(o(),u(f,{key:0},[n[5]||(n[5]=e("div",{"i-carbon-cics-program":"","text-xl":""},null,-1)),e("div",null,[n[4]||(n[4]=e("div",{"text-sm":"",op50:""}," Client bundle size ",-1)),e("div",null,v(x(l.current.size.clientBundle)),1)])],64)):w("",!0),l.current.size.nitroBundle?(o(),u(f,{key:1},[n[7]||(n[7]=e("div",{"i-carbon-bare-metal-server":"","text-xl":""},null,-1)),e("div",null,[n[6]||(n[6]=e("div",{"text-sm":"",op50:""}," Nitro bundle size ",-1)),e("div",null,v(x(l.current.size.nitroBundle)),1)])],64)):w("",!0),n[12]||(n[12]=e("div",{"i-carbon-edge-node":"","text-xl":""},null,-1)),e("div",null,[n[8]||(n[8]=e("div",{"text-sm":"",op50:""}," Built ",-1)),e("div",null,v(i(U)(new Date(l.current.endTime))),1)]),n[13]||(n[13]=e("div",{"i-carbon:folder-parent":"","text-xl":""},null,-1)),e("div",null,[n[9]||(n[9]=e("div",{"text-sm":"",op50:""}," Report Path ",-1)),m(C,{filepath:l.current.analyzeDir},null,8,["filepath"])])]),n[16]||(n[16]=e("div",{"flex-auto":""},null,-1)),m(A,{n:"rose",icon:"carbon-delete",onClick:n[0]||(n[0]=r=>T(l.current.name))},{default:d(()=>n[14]||(n[14]=[y(" Delete this report ")])),_:1})])):w("",!0),n._lazyshow1||i(s).id==="bundle-client"?(n._lazyshow1=!0,o(),u(f,null,[D(e("iframe",{src:`${i($)}${l.current.slug}/client.html`,"h-full":"","w-full":""},null,8,["src"]),[[I,i(s).id==="bundle-client"]])],64)):w("v-show-if",!0),n._lazyshow2||i(s).id==="bundle-nitro"?(n._lazyshow2=!0,o(),u(f,null,[D(e("iframe",{src:`${i($)}${l.current.slug}/nitro.html`,"h-full":"","w-full":""},null,8,["src"]),[[I,i(s).id==="bundle-nitro"]])],64)):w("v-show-if",!0),n._lazyshow3||i(s).id==="vite-inspect"?(n._lazyshow3=!0,o(),u(f,null,[D(e("iframe",{src:`${i($)}${l.current.slug}/.vite-inspect/`,"h-full":"","w-full":""},null,8,["src"]),[[I,i(s).id==="vite-inspect"]])],64)):w("v-show-if",!0)])}}}),ze={class:"markdown-body"},$e={__name:"analyze-build",setup(N,{expose:c}){return c({frontmatter:{}}),($,b)=>(o(),u("div",ze,b[0]||(b[0]=[e("h1",null,"Build Analyze",-1),e("p",null,[y("DevTools provides a build analyze tool to help you understand the size of your app in production. Whenever you start a new build, it runs the command "),e("code",null,"nuxt build --analyze"),y(" and present the output data directly in DevTools for easy browsing and comparing.")],-1)])))}},_e=$e,Be={flex:"~ col"},Ce=["onClick"],ke={flex:"~ gap-1 items-center wrap","w-full":"","text-sm":"",op60:""},Ne={flex:"~ items-center justify-center wrap",p4:""},Te={flex:"~ col gap-1","w-250":"",p4:""},Ae={flex:"~ gap-3",mt2:"","justify-end":""},Pe=j({__name:"analyze-build",setup(N){const c=h(),z=ee(),$=ne(),b=te("analyze-build:slug",""),s=V(()=>z.value?.builds.find(r=>r.slug===b.value)??z.value?.builds[0]),x=S(!1),p=S(""),T=V(()=>z.value?.builds.some(r=>r.name===p.value.trim()));async function l(){p.value=await R.generateAnalyzeBuildName(),await c.start()&&(re("analyze-build:start"),k.value={name:p.value,processId:await R.startAnalyzeBuild(await G(),p.value)},x.value&&C())}const n=le();function C(){k.value?.processId&&(n.value=k.value.processId,$.push("/modules/terminals"))}function A(r){return`${((r.endTime-r.startTime)/1e3).toFixed(1)}s`}return ie(()=>[{id:"action:analyze-build: start",title:"Start a new analyze build",icon:"i-carbon-edge-node",action:l}]),(r,t)=>{const _=L,O=we,H=de,K=oe,M=se,W=ue,J=pe,Q=fe,X=ae,Y=_e,Z=ve;return o(),u(f,null,[m(K,{"left-size":30},{left:d(()=>[e("div",Be,[(o(!0),u(f,null,E(i(z)?.builds,a=>(o(),u(f,{key:a.slug},[e("button",{flex:"~ col gap1","hover:bg-active":"",p3:"",class:F(a.slug===i(s)?.slug?"text-primary bg-active":""),onClick:g=>b.value=a.slug},[e("code",null,v(a.name),1),e("div",ke,[t[4]||(t[4]=e("div",{"i-carbon-time":""},null,-1)),e("span",null,v(A(a)),1),t[5]||(t[5]=e("div",{"flex-auto":""},null,-1)),e("span",null,v(i(U)(new Date(a.endTime))),1)])],10,Ce),t[6]||(t[6]=e("div",{"x-divider":""},null,-1))],64))),128)),e("div",Ne,[("processAnalyzeBuildInfo"in r?r.processAnalyzeBuildInfo:i(k))?(o(),B(_,{key:1,n:"primary",icon:"carbon-circle-dash animate-spin",onClick:t[1]||(t[1]=a=>C())},{default:d(()=>t[8]||(t[8]=[y(" Building... ")])),_:1})):(o(),B(_,{key:0,n:"primary",icon:"carbon-edge-node",onClick:t[0]||(t[0]=a=>l())},{default:d(()=>t[7]||(t[7]=[y(" Start a new build ")])),_:1}))])])]),right:d(()=>[i(s)?(o(),B(O,{key:0,current:i(s)},null,8,["current"])):(o(),B(H,{key:1}))]),_:1}),m(i(c),null,{default:d(({resolve:a})=>[m(X,{"model-value":!0,onClose:g=>a(!1)},{default:d(()=>[e("div",Te,[t[13]||(t[13]=e("h3",{class:"text-lg font-medium leading-6",mb2:""}," Start analyze build? ",-1)),t[14]||(t[14]=e("p",{op50:""}," Enter the name of the build: ",-1)),m(M,{modelValue:i(p),"onUpdate:modelValue":t[2]||(t[2]=g=>P(p)?p.value=g:null),placeholder:"Build name"},null,8,["modelValue"]),i(T)?(o(),B(W,{key:0,"n-orange":""},{default:d(()=>t[9]||(t[9]=[y(" A build with the same name already exists, continue would overrides the previous build result. ")])),_:1})):w("",!0),t[15]||(t[15]=e("div",{my3:"","x-divider":""},null,-1)),t[16]||(t[16]=e("p",{op50:""}," The following command will be executed in your terminal: ",-1)),m(J,{code:`npx nuxi analyze --no-serve --name=${i(p)}`,lang:"bash",px4:"",py2:"",border:"~ base rounded",lines:!1},null,8,["code"]),m(Q,{modelValue:i(x),"onUpdate:modelValue":t[3]||(t[3]=g=>P(x)?x.value=g:null),mt2:"",n:"primary"},{default:d(()=>t[10]||(t[10]=[y(" Navigate to terminal ")])),_:1},8,["modelValue"]),e("div",Ae,[m(_,{onClick:g=>a(!1)},{default:d(()=>t[11]||(t[11]=[y(" Cancel ")])),_:2},1032,["onClick"]),m(_,{n:"solid primary",onClick:g=>a(!0)},{default:d(()=>t[12]||(t[12]=[y(" Start ")])),_:2},1032,["onClick"])])])]),_:2},1032,["onClose"])]),_:1}),m(Z,null,{default:d(()=>[m(Y)]),_:1})],64)}}});export{Pe as default};