feat(build): report total build time

Author: danielroe

packages/nuxt-cli/src/commands/build.ts

@@ -7,6 +7,7 @@ import colors from 'picocolors'
 
 import{showBanner}from'../utils/banner'
 import{overrideEnv}from'../utils/env'
+import{formatDuration}from'../utils/formatting'
 import{clearBuildDir}from'../utils/fs'
 import{loadKit}from'../utils/kit'
 import{acquireLock,formatLockError}from'../utils/lockfile'
@@ -39,6 +40,8 @@ export default defineCommand({
 asyncrun(ctx){
 overrideEnv('production')
 
+conststart=Date.now()
+
 constcwd=resolve(ctx.args.cwd||ctx.args.rootDir)
 
 constprofileArg=ctx.args.profile
@@ -127,10 +130,10 @@ export default defineCommand({
 // TODO: revisit later if/when nuxt build --prerender will output hybrid
 constdir=nitro?.options.output.publicDir
 constpublicDir=dir ? relative(process.cwd(),dir) : '.output/public'
-outro(`✨ You can now deploy ${colors.cyan(publicDir)} to any static hosting!`)
+outro(`✨ You can now deploy ${colors.cyan(publicDir)} to any static hosting!${colors.gray(`(${formatDuration(Date.now()-start)})`)}`)
 }
 else{
-outro('✨ Build complete!')
+outro(`✨ Build complete in ${colors.cyan(formatDuration(Date.now()-start))}!`)
 }
 }
 finally{

packages/nuxt-cli/src/utils/formatting.ts

@@ -97,3 +97,22 @@ export function formatInfoBox(infoObj: Record<string, string | undefined>): stri
 
 returnboxStr
 }
+
+/**
+ * Format an elapsed duration in milliseconds for display, using `ms` below a
+ * second and seconds (or minutes and seconds) above it.
+ */
+exportfunctionformatDuration(ms: number): string{
+if(ms<1000){
+return`${Math.round(ms)}ms`
+}
+
+consttotalSeconds=ms/1000
+if(totalSeconds<60){
+return`${Number(totalSeconds.toFixed(totalSeconds<10 ? 2 : 1))}s`
+}
+
+constminutes=Math.floor(totalSeconds/60)
+constseconds=Math.round(totalSeconds-minutes*60)
+returnseconds ? `${minutes}m ${seconds}s` : `${minutes}m`
+}

packages/nuxt-cli/test/unit/utils/formatting.spec.ts

@@ -0,0 +1,25 @@
+import{describe,expect,it}from'vitest'
+
+import{formatDuration}from'../../../src/utils/formatting'
+
+describe('formatDuration',()=>{
+it('should render sub-second durations in milliseconds',()=>{
+expect(formatDuration(0)).toBe('0ms')
+expect(formatDuration(12.4)).toBe('12ms')
+expect(formatDuration(999)).toBe('999ms')
+})
+
+it('should render seconds above a second',()=>{
+expect(formatDuration(1000)).toBe('1s')
+expect(formatDuration(1234)).toBe('1.23s')
+expect(formatDuration(9999)).toBe('10s')
+expect(formatDuration(12_300)).toBe('12.3s')
+expect(formatDuration(59_000)).toBe('59s')
+})
+
+it('should render minutes and seconds above a minute',()=>{
+expect(formatDuration(60_000)).toBe('1m')
+expect(formatDuration(90_000)).toBe('1m 30s')
+expect(formatDuration(3_600_000)).toBe('60m')
+})
+})