@revealui/core 0.0.1-pre.0

package/dist/core/gaurds/logger/loggerNotProd/errorWithCodeSnippet/getPrettyErrMessage.spec.ts

@@ -0,0 +1,101 @@
+import { getPrettyErrMessage } from "../errorWithCodeSnippet.js"
+
+import { describe, expect, it } from "vitest"
+
+describe("getPrettyErrMessage()", () => {
+  const id = "/home/rom/code/reveal/examples/react-full/components/Counter.tsx"
+  const frame = `Expected ";" but found "React"
+  1  |  iemport React, { useState } from 'react'
+     |          ^
+  2  |  
+  3  |  export { Counter }`
+
+  it("operations", () => {
+    {
+      const message =
+        "/home/rom/code/reveal/examples/react-full/components/Counter.tsx"
+      const err = { message, id, frame }
+      expect(getPrettyErrMessage(err)).toBe("")
+    }
+    {
+      const message =
+        "/home/rom/code/reveal/examples/react-full/components/Counter.tsx:1:2: abc"
+      const err = { message, id, frame }
+      expect(getPrettyErrMessage(err)).toBe("abc")
+    }
+    {
+      const message = "Transform failed with 1 error"
+      const err = { message, id, frame }
+      expect(getPrettyErrMessage(err)).toBe("")
+    }
+    {
+      const message = "Transform failed with 42 errors: abc"
+      const err = { message, id, frame }
+      expect(getPrettyErrMessage(err)).toBe("abc")
+    }
+    {
+      const codeSnippet = [
+        // prettier-ignore
+        // biome-ignore format:
+        '  | some',
+        "> | fake",
+        "  | code",
+      ].join("\n")
+      const message = `(1:2)\n${codeSnippet}`
+      const err = { message, id, frame }
+      expect(getPrettyErrMessage(err)).toBe(codeSnippet.trim())
+    }
+    {
+      const message = "(1:2)"
+      const err = { message, id, frame }
+      expect(getPrettyErrMessage(err)).toBe("(1:2)")
+    }
+  })
+
+  it("real use case - @vitejs/plugin-react (1)", () => {
+    const message = `Transform failed with 1 error:
+/home/rom/code/reveal/examples/react-full/components/Counter.tsx:1:8: ERROR: Expected ";" but found "React"`
+    const err = { message, id, frame }
+    expect(getPrettyErrMessage(err)).toBe("")
+  })
+
+  it("real use case - @vitejs/plugin-react (2)", () => {
+    const message =
+      '/home/rom/code/reveal/examples/react-full/components/Counter.tsx:1:8: Expected ";" but found "React"'
+    const err = { message, id, frame }
+    expect(getPrettyErrMessage(err)).toBe("")
+  })
+
+  it("real use case - @vitejs/plugin-vue", () => {
+    const id = "/home/rom/code/reveal/examples/vue-full/pages/index/+Page.vue"
+    const message = `SyntaxError: [@vue/compiler-sfc] Missing semicolon. (2:7)
+
+/home/rom/code/reveal/examples/vue-full/pages/index/+Page.vue
+12 |  
+13 |  <script lang="ts" setup>
+14 |  iemport Counter from '../../components/Counter.vue.js'
+   |         ^
+15 |  import { navigate } from 'reveal/client/router'
+16 |  `
+    const result = `SyntaxError: [@vue/compiler-sfc] Missing semicolon. 
+
+12 |  
+13 |  <script lang="ts" setup>
+14 |  iemport Counter from '../../components/Counter.vue.js'
+   |         ^
+15 |  import { navigate } from 'reveal/client/router'
+16 |`
+    const err = { message, id, frame }
+    expect(getPrettyErrMessage(err)).toBe(result)
+  })
+
+  it("real use case - @vitejs/plugin-react (3)", () => {
+    const message =
+      "/home/rom/code/reveal/examples/react-full/components/Counter.tsx: Missing semicolon. (1:7)\n\n\u001b[0m\u001b[31m\u001b[1m>\u001b[22m\u001b[39m\u001b[90m 1 |\u001b[39m iemport \u001b[33mReact\u001b[39m\u001b[33m,\u001b[39m { useState } \u001b[36mfrom\u001b[39m \u001b[32m'react'\u001b[39m\u001b[0m\n\u001b[0m \u001b[90m   |\u001b[39m        \u001b[31m\u001b[1m^\u001b[22m\u001b[39m\u001b[0m\n\u001b[0m \u001b[90m 2 |\u001b[39m\u001b[0m\n\u001b[0m \u001b[90m 3 |\u001b[39m \u001b[36mexport\u001b[39m { \u001b[33mCounter\u001b[39m }\u001b[0m\n\u001b[0m \u001b[90m 4 |\u001b[39m\u001b[0m"
+    const frame =
+      "> 1  |  iemport React, { useState } from 'react'\n   |         ^\n  2  |  \n  3  |  export { Counter }  4 |"
+    const err = { message, id, frame }
+    const codeSnippet = message.split("semicolon. (1:7)")[1]
+    expect(getPrettyErrMessage(err)).toBe(`Missing semicolon. ${codeSnippet}`)
+  })
+})

package/dist/core/gaurds/logger/loggerNotProd/errorWithCodeSnippet/getPrettyErrorWithCodeSnippet.spec.ts

@@ -0,0 +1,232 @@
+import {
+  getPrettyErrorWithCodeSnippet,
+  isErrorWithCodeSnippet,
+} from "../errorWithCodeSnippet.js"
+
+import { describe, expect, it } from "vitest"
+
+import { stripAnsi } from "../../../../utils/string/stripAnsi.js"
+import { errBabelReact } from "./fixture-errors/errBabelReact.js"
+import { errBabelSolid } from "./fixture-errors/errBabelSolid.js"
+import { errEsbuild } from "./fixture-errors/errEsbuild.js"
+import { errMdx1 } from "./fixture-errors/errMdx1.js"
+import { errMdx2 } from "./fixture-errors/errMdx2.js"
+import { errPostcss } from "./fixture-errors/errPostcss.js"
+import { errSwc } from "./fixture-errors/errSwc.js"
+import { errSwcBig } from "./fixture-errors/errSwcBig.js"
+import { errVueCss } from "./fixture-errors/errVueCss.js"
+import { errVueHtml } from "./fixture-errors/errVueHtml.js"
+import { errVueJavascript } from "./fixture-errors/errVueJavascript.js"
+
+// To generate new test cases:
+// Uncomment the console.log() statements in ./errorWithCodeSnippet.ts
+
+describe("getPrettyErrorWithCodeSnippet() - success", () => {
+  it("real use case - @vitejs/plugin-react-swc", () => {
+    const formatted = getPrettyErrorWithCodeSnippet(
+      errSwc,
+      "/home/rom/code/reveal/examples/react-full"
+    )
+    expect(stripAnsi(formatted)).toMatchInlineSnapshot(`
+      "Failed to transpile /pages/hello/+Page.tsx because:
+      × Expected ';', '}' or <eof>
+         ╭─[/home/rom/code/reveal/examples/react-full/pages/hello/+Page.tsx:1:1]
+       1 │ export default Page
+       2 │ 
+       3 │ impeort React from 'react'
+         · ───┬─── ─────
+         ·    ╰── This is the expression part of an expression statement
+       4 │ 
+       5 │ function Page({ name }: { name: string }) {
+       6 │   return (
+         ╰────
+      Caused by:
+          Syntax Error"
+    `)
+  })
+
+  it("real use case - @vitejs/plugin-react-swc - big JSX error", () => {
+    const formatted = getPrettyErrorWithCodeSnippet(
+      errSwcBig,
+      "/home/rom/code/reveal/examples/react-full"
+    )
+    expect(stripAnsi(formatted)).toMatchInlineSnapshot(`
+      "Failed to transpile /pages/index/+Page.tsx because:
+      × Expression expected
+          ╭─[/home/rom/code/reveal/examples/react-full/pages/index/+Page.tsx:6:1]
+        6 │ 
+        7 │ function Page() {
+        8 │   return (
+        9 │     <>
+          ·      ─
+       10 │       <h1>
+       11 │         Welcome to reveal
+       12 │       <h1>
+          ╰────
+        × Unexpected token. Did you mean \`{'}'}\` or \`&rbrace;\`?
+          ╭─[/home/rom/code/reveal/examples/react-full/pages/index/+Page.tsx:29:1]
+       29 │       </p>
+       30 │     </>
+       31 │   )
+       32 │ }
+          · ▲
+          ╰────
+        × Unterminated JSX contents
+          ╭─[/home/rom/code/reveal/examples/react-full/pages/index/+Page.tsx:27:1]
+       27 │               Random Page
+       28 │             </button>
+       29 │           </p>
+       30 │ ╭─▶     </>
+       31 │ │     )
+       32 │ ╰─▶ }
+          ╰────
+      Caused by:
+          Syntax Error"
+    `)
+  })
+
+  it("real use case - @vitejs/plugin-vue - SFC HTML", () => {
+    const formatted = getPrettyErrorWithCodeSnippet(
+      errVueHtml,
+      "/home/rom/code/reveal/examples/vue-full"
+    )
+    expect(stripAnsi(formatted)).toMatchInlineSnapshot(`
+      "Failed to transpile /pages/index/+Page.vue because:
+      Element is missing end tag.
+      1  |  <template>
+      2  |    <h1>Welcome to reveal<h1>
+         |                                                ^
+      3  |    This page is:
+      4  |    <ul>"
+    `)
+  })
+
+  it("real use case - @vitejs/plugin-vue - SFC JavaScript", () => {
+    const formatted = getPrettyErrorWithCodeSnippet(
+      errVueJavascript,
+      "/home/rom/code/reveal/examples/vue-full"
+    )
+    expect(stripAnsi(formatted)).toMatchInlineSnapshot(`
+      "Failed to transpile /pages/index/+Page.vue because:
+      [@vue/compiler-sfc] Missing semicolon. 
+      12 |  
+      13 |  <script lang="ts" setup>
+      14 |  imeport Counter from '../../components/Counter.vue'
+         |         ^
+      15 |  import { navigate } from 'reveal/client/router.js'
+      16 |"
+    `)
+  })
+
+  it("real use case - @vitejs/plugin-vue - SFC CSS", () => {
+    const formatted = getPrettyErrorWithCodeSnippet(
+      errVueCss,
+      "/home/rom/code/reveal/examples/vue-full"
+    )
+    expect(stripAnsi(formatted)).toMatchInlineSnapshot(`
+      "Failed to transpile /renderer/Layout.vue because:
+      Unexpected }
+      43 |    margin: auto;
+      44 |  }}
+      45 |  .content {
+         |    ^
+      46 |    padding: 20px;
+      47 |    padding-bottom: 50px;"
+    `)
+  })
+
+  it("real use case - @vitejs/plugin-react - JavaScript esbuild", () => {
+    const formatted = getPrettyErrorWithCodeSnippet(
+      errEsbuild,
+      "/home/rom/code/reveal/examples/react-full"
+    )
+    expect(stripAnsi(formatted)).toMatchInlineSnapshot(`
+      "Failed to transpile /renderer/Layout.tsx because:
+      Unexpected "}"
+      5  |  import type { PageContext } from './types'
+      6  |  
+      7  |  export { Layout }}
+         |                      ^
+      8  |  
+      9  |  function Layout({ pageContext, children }: { pageContext: PageContext; children: React.ReactNode }) {"
+    `)
+  })
+
+  it("real use case - @vitejs/plugin-react - JavaScript Babel", () => {
+    const formatted = getPrettyErrorWithCodeSnippet(
+      errBabelReact,
+      "/home/rom/code/reveal/examples/react-full"
+    )
+    expect(stripAnsi(formatted)).toMatchInlineSnapshot(`
+      "Failed to transpile /renderer/Layout.tsx because:
+      Unexpected token 
+         5 | import type { PageContext } from './types'
+         6 |
+      >  7 | export { Layout }}
+           |                     ^
+         8 |
+         9 | function Layout({ pageContext, children }: { pageContext: PageContext; children: React.ReactNode }) {
+        10 |   return ("
+    `)
+  })
+
+  it("real use case - vite-plugin-solid - JavaScript with Babel", () => {
+    const formatted = getPrettyErrorWithCodeSnippet(
+      errBabelSolid,
+      "/home/rom/code/reveal/examples/solid-spa"
+    )
+    expect(stripAnsi(formatted)).toMatchInlineSnapshot(`
+      "Failed to transpile /renderer/_default.page.client.tsx because:
+      Invalid left-hand side in assignment expression. 
+        15 | async function render(pageContext: PageContextClient) {
+        16 |   const { Page } = pageContext
+      > 17 |   if (1 = 1) {}
+           |       ^
+        18 |   if (disposePreviousPage) {
+        19 |     disposePreviousPage()
+        20 |   }"
+    `)
+  })
+})
+
+describe("getPrettyErrorWithCodeSnippet() - failure", () => {
+  // We can't prettify these errors because there isn't any code snippet (error.pluginCode contains the whole file without any code position).
+  // That said, we could generate the code snippet ourselves since we have error.position and `error.pluginCode`.
+  it("real use case - @mdx-js/rollup", () => {
+    expect(isErrorWithCodeSnippet(errMdx1)).toBe(false)
+  })
+  it("real use case - @mdx-js/rollup", () => {
+    expect(isErrorWithCodeSnippet(errMdx2)).toBe(false)
+  })
+
+  it("real use case - @vitejs/plugin-react - CSS with PostCSS", () => {
+    const formatted = getPrettyErrorWithCodeSnippet(
+      errPostcss,
+      "/home/rom/code/reveal/examples/react-full"
+    )
+    // The code snippet should be (note the erroneous double }} at line 3 column 2):
+    // ```css
+    // a {
+    //  text-decoration: none;
+    // }}
+    // #sidebar a {
+    //   padding: 2px 10px;
+    //   margin-left: -10px;
+    // }
+    // #sidebar a.is-active {
+    //   background-color: #eee;
+    // }
+    // ```
+    // But the frame shows the importer instead. Seems like an upstream bug? The line and column number is correct => someone upstream is using the source code of the wrong file.
+    expect(stripAnsi(formatted)).toMatchInlineSnapshot(`
+      "Failed to transpile /renderer/css/links.css because:
+      [postcss] postcss-import: Unexpected }
+      1  |  @import './reset.css';
+      2  |  @import './links.css';
+      3  |  @import './code.css';
+         |    ^
+      4  |  @import './page-transition-loading-animation.css';
+      5  |"
+    `)
+  })
+})

package/dist/core/gaurds/logger/loggerNotProd/errorWithCodeSnippet.ts

@@ -0,0 +1,212 @@
+// Prettify transpilation errors
+//  - Doesn't work for optimize errors: https://gist.github.com/brillout/9b7bb78ae866558b292ea1b516a986ec
+
+export {
+  getPrettyErrorWithCodeSnippet,
+  isEquivalentErrorWithCodeSnippet,
+  isErrorWithCodeSnippet,
+}
+export type { ErrorWithCodeSnippet }
+
+// For ./errorWithCodeSnippet.spec.ts
+export { getPrettyErrMessage }
+
+// Copied & adapted from https://github.com/vitejs/vite/blob/9c114c5c72a6af87e3330d5573362554b4511265/packages/vite/src/node/server/middlewares/error.ts
+
+import pc from "@brillout/picocolors"
+import {
+  cleanFilePathUnkown,
+  getFilePathToShowToUserFromUnkown,
+} from "../../../processing/getters/getFilePath.js"
+import { escapeRegex } from "../../../utils/string/escapeRegex.js"
+import { removeEmptyLines } from "../../../utils/string/removeEmptyLines.js"
+import { stripAnsi } from "../../../utils/string/stripAnsi.js"
+import { assert } from "../../assertions/assert/index.js"
+import { isObject } from "../../validators/isObject.js"
+
+// Subset of RollupError
+type ErrorWithCodeSnippet = {
+  id: string
+  frame?: string
+  message?: string
+  plugin?: string
+}
+
+function isErrorWithCodeSnippet(err: unknown): err is ErrorWithCodeSnippet {
+  if (!isObject(err)) {
+    return false
+  }
+  const { id, frame, message } = err
+  if (typeof id !== "string" || !id.trim()) {
+    return false
+  }
+  if (typeof frame === "string" && frame.trim()) {
+    return true
+  }
+  if (typeof message === "string" && containsCodeSnippet(message)) {
+    return true
+  }
+  return false
+}
+
+function getPrettyErrorWithCodeSnippet(
+  err: ErrorWithCodeSnippet,
+  userRootDir: string
+): string {
+  /* Uncomment to inspect and/or create fixture for ./errorWithCodeSnippet.spec.ts
+  console.log('userRootDir', userRootDir)
+  console.log('err.message', err.message)
+  console.log('err.stack', (err as any).stack)
+  console.log('err.pluginCode', (err as any).pluginCode)
+  console.log('Object.keys(err)', Object.keys(err))
+  console.log('err', err)
+  // For copy-pasting errors while preserving terminal ANSI colors
+  console.log(
+    'JSON.stringify(err)',
+    JSON.stringify({
+      ...err,
+      message: err.message,
+      stack: (err as any).stack
+    })
+  )
+  //*/
+
+  assert(isErrorWithCodeSnippet(err))
+  let { id, frame } = err
+
+  const msgFirstLine = [
+    pc.red("Failed to transpile"),
+    pc.bold(pc.red(getFilePathToShowToUserFromUnkown(id, userRootDir))),
+    pc.red("because:"),
+  ].join(" ")
+
+  const errMsg = getPrettyErrMessage(err)
+
+  if (errMsg && containsCodeSnippet(errMsg)) {
+    // Conditionally swallowing frame is a risky move but worth it thanks to logErrorDebugNote()
+    // We swallow frame because many tools set 'error.frame' to something rubbish, for example:
+    //  - @vitejs/plugin-vue
+    //  - @vitejs/plugin-react-swc
+    //  - @mdx-js/rollup
+    frame = undefined
+  } else {
+    assert(frame)
+    frame = frame ? frame.trim() : ""
+    assert(frame)
+    frame = pc.yellow(frame)
+  }
+
+  let msg = [msgFirstLine, errMsg, frame].filter(Boolean).join("\n")
+  msg = removeEmptyLines(msg)
+
+  /* Vite already does a fairly good job at showing a concise error in the layover
+  server.ws.send({
+    type: 'error',
+    err: msg
+  })
+  */
+
+  return msg
+}
+
+function getPrettyErrMessage(err: ErrorWithCodeSnippet): string | null {
+  const { id, frame } = err
+  let errMsg = err.message
+
+  if (!errMsg || !errMsg.trim()) return null
+
+  const trail = /(?:\:|)(?:\s|$)/
+  // Remove "Transform failed with 1 error:" (redundant since we already print an intro message)
+  errMsg = errMsg
+    .split(reg([/Transform failed with \d* error(?:s|)/, trail], "gi"))
+    .join("")
+  // Remove "/home/rom/code/reveal/examples/react-full/components/Counter.tsx:1:8:" (redundant since we already print the filename)
+  const pos = /(?:\:\d+|)/
+  errMsg = errMsg.split(reg([id, pos, pos, trail], "gi")).join("")
+  errMsg = errMsg
+    .split(reg([cleanFilePathUnkown(id), pos, pos, trail], "gi"))
+    .join("")
+  // Remove "ERROR:" (useless)
+  errMsg = errMsg.split(reg(["ERROR:", trail])).join("")
+  // Remove "Internal server error:" (useless)
+  errMsg = errMsg.split(reg(["Internal server error", trail])).join("")
+
+  if (containsCodeSnippet(errMsg)) {
+    errMsg = removeStandaloneCodePosition(errMsg)
+  }
+
+  errMsg = errMsg.trim()
+  if (frame && frame.includes(errMsg)) errMsg = ""
+
+  return errMsg
+}
+
+function containsCodeSnippet(str: string) {
+  str = stripAnsi(str)
+  let codeBlockSize = 0
+  for (const line of str.split("\n")) {
+    if (!isCodeSnippetLine(line)) {
+      codeBlockSize = 0
+    } else {
+      codeBlockSize++
+    }
+    if (codeBlockSize >= 3) {
+      return true
+    }
+  }
+  return false
+}
+
+function isCodeSnippetLine(line: string): boolean {
+  // Babel
+  if (/[\s\d>]*\|/.test(line)) return true
+  // SWC
+  if (/[\s\d>]*(╭─|│|·)/.test(line)) return true
+  return false
+}
+
+function reg(parts: (RegExp | string)[], flags: string = "") {
+  return new RegExp(
+    parts
+      .map((part) =>
+        typeof part === "string" ? escapeRegex(part) : part.source
+      )
+      .join(""),
+    flags
+  )
+}
+
+function removeStandaloneCodePosition(errMsg: string) {
+  // Remove weird standalone code position " (2:7) "
+  errMsg = errMsg
+    .split("\n")
+    .map((line) => {
+      const posRE = /(\s|^)\(\d+:\d+\)(\s|$)/
+      assert(posRE.test(" (1:2)"))
+      assert(posRE.test("(13:42) "))
+      if (!isCodeSnippetLine(line)) {
+        line = line.split(posRE).join("")
+      }
+      return line
+    })
+    .join("\n")
+  return errMsg
+}
+
+function isEquivalentErrorWithCodeSnippet(
+  err1: unknown,
+  err2: unknown
+): boolean {
+  if (!isObject(err1) || !isObject(err2)) return false
+  if (
+    isDefinedAndSame(err1.message, err2.message) &&
+    isDefinedAndSame(err1.frame, err2.frame) &&
+    isDefinedAndSame(err1.id, err2.id)
+  ) {
+    return true
+  }
+  return false
+}
+function isDefinedAndSame(val1: unknown, val2: unknown) {
+  return val1 && val1 === val2
+}

package/dist/core/gaurds/logger/loggerNotProd/log.ts

@@ -0,0 +1,124 @@
+export {
+  applyViteSourceMapToStackTrace,
+  logDirectly,
+  logWithRevealTag,
+  logWithViteTag,
+}
+
+import pc from "@brillout/picocolors"
+
+import { getViteDevServer } from "../../../globals/contexts/index.js"
+import { projectInfo } from "../../../globals/versions/projectInfo.js"
+import { stripAnsi } from "../../../utils/string/stripAnsi.js"
+import { assert } from "../../assertions/assert/index.js"
+import { assertIsNotProductionRuntime } from "../../assertions/assertIsNotProductionRuntime/index.js"
+import { hasProp } from "../../validators/hasProp.js"
+import { isErrorDebug } from "../../validators/isErrorDebug.js"
+import { LogCategory, LogType } from "../loggerNotProd.js"
+
+assertIsNotProductionRuntime()
+
+type ProjectTag = `[reveal]` | `[reveal@${typeof projectInfo.projectVersion}]`
+
+function logWithRevealTag(
+  msg: string,
+  logType: LogType,
+  category: LogCategory | null,
+  showRevealVersion = false
+) {
+  const projectTag = getProjectTag(showRevealVersion)
+  msg = prependTags(msg, projectTag, category, logType)
+  logDirectly(msg, logType)
+}
+function getProjectTag(showRevealVersion: boolean) {
+  let projectTag: ProjectTag
+  if (showRevealVersion) {
+    projectTag = `[reveal@${projectInfo.projectVersion}]`
+  } else {
+    projectTag = `[reveal]`
+  }
+  return projectTag
+}
+function logWithViteTag(
+  msg: string,
+  logType: LogType,
+  category: LogCategory | null
+) {
+  msg = prependTags(msg, "[vite]", category, logType)
+  logDirectly(msg, logType)
+}
+
+// Not production => every log is triggered by logDirectly()
+//  - Even all Vite logs also go through logDirectly() (see interceptors of loggerVite.ts)
+//  - Production => logs aren't managed by loggerNotProd.ts => logDirectly() is never called (not even loaded as asserted by assertIsVitePluginCode())
+function logDirectly(thing: unknown, logType: LogType) {
+  applyViteSourceMapToStackTrace(thing)
+
+  if (logType === "info") {
+    console.log(thing)
+    return
+  }
+  if (logType === "warn") {
+    console.warn(thing)
+    return
+  }
+  if (logType === "error") {
+    console.error(thing)
+    return
+  }
+  if (logType === "error-recover") {
+    // stderr because user will most likely want to know about error recovering
+    console.error(thing)
+    return
+  }
+
+  assert(false)
+}
+
+function applyViteSourceMapToStackTrace(thing: unknown) {
+  if (isErrorDebug()) return
+  if (!hasProp(thing, "stack")) return
+  const viteDevServer = getViteDevServer()
+  if (!viteDevServer) return
+  // Apply Vite's source maps
+  viteDevServer.ssrFixStacktrace(thing as Error)
+}
+
+function prependTags(
+  msg: string,
+  projectTag: "[vite]" | ProjectTag,
+  category: LogCategory | null,
+  logType: LogType
+) {
+  const color = (s: string) => {
+    if (logType === "error" && !hasRed(msg)) return pc.bold(pc.red(s))
+    if (logType === "error-recover" && !hasGreen(msg))
+      return pc.bold(pc.green(s))
+    if (logType === "warn" && !hasYellow(msg)) return pc.yellow(s)
+    if (projectTag === "[vite]") return pc.bold(pc.cyan(s))
+    if (projectTag.startsWith(`[reveal`)) return pc.bold(pc.cyan(s))
+    assert(false)
+  }
+  let tag = color(`${projectTag}`)
+  if (category) {
+    tag = tag + pc.dim(`[${category}]`)
+  }
+
+  const timestamp = pc.dim(new Date().toLocaleTimeString())
+
+  const whitespace = /\s|\[/.test(stripAnsi(msg)[0]!) ? "" : " "
+
+  return `${timestamp} ${tag}${whitespace}${msg}`
+}
+function hasRed(str: string): boolean {
+  // https://github.com/brillout/picocolors/blob/e291f2a3e3251a7f218ab6369ae94434d85d0eb0/picocolors.js#L57
+  return str.includes("\x1b[31m")
+}
+function hasGreen(str: string): boolean {
+  // https://github.com/brillout/picocolors/blob/e291f2a3e3251a7f218ab6369ae94434d85d0eb0/picocolors.js#L58
+  return str.includes("\x1b[32m")
+}
+function hasYellow(str: string): boolean {
+  // https://github.com/brillout/picocolors/blob/e291f2a3e3251a7f218ab6369ae94434d85d0eb0/picocolors.js#L59
+  return str.includes("\x1b[33m")
+}