chore: Switch to logger with JSON support

And because I like my own logger more than consola.

Author: aklinker1

bun.lock

@@ -4,15 +4,16 @@ ignorePaths:
   - src/@types/gql.d.ts
   - "**/*.snap"
 words:
+  - adduser
   - aklinker
-  - klinker
-  - linkedom
-  - oxlint
-  - importmap
-  - ocfdgncpifmegplaglcnglhioflaimkd
+  - crxid
   - grpahql
-  - libstdc
+  - importmap
+  - klinker
   - libgcc
-  - adduser
+  - libstdc
+  - linkedom
   - microsoftedge
-  - crxid
+  - noindexed
+  - ocfdgncpifmegplaglcnglhioflaimkd
+  - oxlint

cspell.yml

@@ -16,14 +16,13 @@
     "postinstall": "simple-git-hooks"
   },
   "dependencies": {
+    "@aklinker1/logger": "^1.0.6",
     "@aklinker1/zero-ioc": "^1.5.1",
     "@aklinker1/zeta": "^2.2.0",
-    "consola": "^3.4.2",
     "dataloader": "^2.2.3",
     "dedent": "^1.7.2",
     "graphql": "^16.13.2",
     "linkedom": "^0.18.12",
-    "picocolors": "^1.1.1",
     "zod": "^4.3.6"
   },
   "devDependencies": {

package.json

@@ -1,19 +1,14 @@
 #!/usr/bin/env bun
-import consola, { LogLevels } from "consola";
 import app from "../src/server";
 import { generateGqlTypes } from "./generate-gql-types";
-import pc from "picocolors";
 import { version } from "../package.json";
+import { createLogger } from "@aklinker1/logger";
+
+const logger = createLogger("http");
 
 const fetch = app.build();
 await generateGqlTypes(fetch);
 
-consola.level = LogLevels.debug;
-const port = Number(process.env.PORT ?? "3000");
-Bun.serve({ port, fetch });
+const server = Bun.serve({ fetch });
 
-consola.success(
-  `${pc.cyan("@wxt-dev/queue v" + version)} ${pc.dim("server started")}`,
-);
-consola.log(`  ${pc.bold(pc.green("➜"))} http://localhost:${port}`);
-console.log();
+logger.success("@wxt-dev/queue server started", { version, url: server.url });

scripts/dev.ts

@@ -1,7 +1,9 @@
 import CodeBlockWriter from "code-block-writer";
-import { consola } from "consola";
 import type { ServerSideFetch } from "@aklinker1/zeta/types";
 import app from "../src/server";
+import { createLogger } from "@aklinker1/logger";
+
+const logger = createLogger("gen:gql-types");
 
 const typesFile = Bun.file("src/@types/gql.d.ts");
 
@@ -13,7 +15,7 @@ const scalarNameToTs = {
 };
 
 export async function generateGqlTypes(fetch: ServerSideFetch = app.build()) {
-  consola.info("Generating GraphQL types...");
+  logger.info("Starting...");
   const introspection = await introspect(fetch);
 
   const {
@@ -53,7 +55,7 @@ export async function generateGqlTypes(fetch: ServerSideFetch = app.build()) {
         case "INTERFACE":
           return writeObjectType(code, argTypes, type);
         default:
-          return consola.warn("Unknown kind:", {
+          return logger.warn("Unknown kind:", {
             kind: type.kind,
             name: type.name,
           });
@@ -66,7 +68,7 @@ export async function generateGqlTypes(fetch: ServerSideFetch = app.build()) {
   code.newLine();
 
   await Bun.write(typesFile, code.toString());
-  consola.success("Generated GraphQL types");
+  logger.success("Done");
 }
 
 function capitalizeFirstLetter(str: string): string {
@@ -82,7 +84,7 @@ function getTsTypeString(gqlType: any): string {
   if (gqlType.kind === "SCALAR" || gqlType.kind === "OBJECT")
     return `${gqlType.name} | undefined`;
 
-  consola.warn("Unknown TS type:", gqlType);
+  logger.warn("Unknown GQL -> TS type", { gqlType });
   return "unknown";
 }
 
@@ -124,7 +126,7 @@ function writeScalarType(code: CodeBlockWriter, type: any) {
   // @ts-expect-error
   const typeStr = scalarNameToTs[type.name];
   if (typeStr == null) {
-    consola.warn("Unknown scalar type:", type);
+    logger.warn("Unknown scalar type:", { type });
   }
   code.writeLine(`type ${type.name} = ${typeStr || "unknown"};`);
 }

scripts/generate-gql-types.ts

@@ -1,9 +1,10 @@
 import { buildSchema, graphql } from "graphql";
 import gqlSchema from "../assets/schema.gql" with { type: "text" };
 import { rootResolver } from "./resolvers";
-import { consola } from "consola";
-import pc from "picocolors";
 import { container } from "../dependencies";
+import { createLogger } from "@aklinker1/logger";
+
+const logger = createLogger("gql");
 
 export function createGraphql() {
   const schema = buildSchema(gqlSchema);
@@ -15,11 +16,8 @@ export function createGraphql() {
     const { operationName = "Unknown", query, variables } = body;
 
     const start = performance.now();
-    consola.debug(
-      `${pc.dim(`<-- [${id}]`)} ${pc.green(method)} ${pc.cyan(
-        pc.bold(operationName),
-      )}`,
-    );
+
+    logger.debug("Running query", { id, method, operationName });
 
     const response = await graphql({
       schema,
@@ -30,11 +28,12 @@ export function createGraphql() {
     });
 
     const end = performance.now();
-    consola.debug(
-      `${pc.dim(`--> [${id}]`)} ${pc.green(method)} ${pc.cyan(
-        pc.bold(operationName),
-      )} ${(end - start).toFixed(3)}ms`,
-    );
+    logger.debug("Query finished", {
+      id,
+      method,
+      operationName,
+      durationMs: end - start,
+    });
 
     return response;
   };

src/graphql/index.ts

@@ -1,30 +1,11 @@
 #!/usr/bin/env bun
-import consola from "consola";
 import app from "./server";
-import pc from "picocolors";
 import { version } from "../package.json";
+import { createLogger } from "@aklinker1/logger";
 
-if (process.env.LOG_LEVEL) {
-  // silent: Number.NEGATIVE_INFINITY
-  // fatal: 0
-  // error: 0
-  // warn: 1
-  // log: 2
-  // info: 3
-  // success: 3
-  // fail: 3
-  // ready: 3
-  // start: 3
-  // box: 3
-  // debug: 4
-  // trace: 5
-  // verbose: Number.POSITIVE_INFINITY
-  consola.level = Number(process.env.LOG_LEVEL);
-}
+const logger = createLogger("http");
 
 const port = Number(process.env.PORT ?? "3000");
 app.listen(port, () => {
-  consola.info(
-    `${pc.cyan("@wxt-dev/queue v" + version)} ${pc.dim("server started")}`,
-  );
+  logger.success("@wxt-dev/queue started", { version, port });
 });

src/main.ts

@@ -1,4 +1,3 @@
-import consola from "consola";
 import { createApp } from "@aklinker1/zeta";
 import { corsPlugin } from "./plugins/cors-plugin";
 import { graphqlApis } from "./apis/graphql-apis";
@@ -8,6 +7,9 @@ import { version } from "./version";
 import dedent from "dedent";
 import { systemApis } from "./apis/system-apis";
 import { OpenApiTag } from "./enums";
+import { createLogger } from "@aklinker1/logger";
+
+const logger = createLogger("http");
 
 const app = createApp({
   schemaAdapter: zodSchemaAdapter,
@@ -47,7 +49,7 @@ const app = createApp({
     ],
   },
 })
-  .onGlobalError(({ error }) => void consola.error(error))
+  .onGlobalError(({ error }) => void logger.error("Request error", { error }))
   .use(corsPlugin)
   .use(systemApis)
   .use(extensionStoreApis)

src/server.ts

@@ -1,14 +1,16 @@
-import consola from "consola";
 import { HTMLAnchorElement, HTMLElement, parseHTML } from "linkedom";
 import { ExtensionStoreName } from "../enums";
 import { buildScreenshotUrl } from "../utils/urls";
+import { createLogger } from "@aklinker1/logger";
+
+const logger = createLogger("chrome-crawler");
 
 export async function crawlExtension(
   id: string,
   lang: string,
   canGenerateTestFixture = false,
 ): Promise<Gql.ChromeExtension | undefined> {
-  consola.info("Crawling " + id);
+  logger.info("Start", { id, lang });
   const url = `https://chromewebstore.google.com/detail/${id}?hl=${lang}`;
   const res = await fetch(url, {
     headers: {
@@ -173,7 +175,7 @@ export async function crawlExtension(
     reviewCount,
     screenshots,
   };
-  consola.debug("Crawl results:", result);
+  logger.debug("Crawl complete", { id, result });
   return result;
 }
 

src/services/chrome-crawler.ts

@@ -1,6 +1,9 @@
+import { createLogger } from "@aklinker1/logger";
 import { ExtensionStoreName } from "../enums";
 import { buildScreenshotUrl } from "../utils/urls";
 
+const logger = createLogger("edge-api");
+
 export interface EdgeApi {
   getAddon(crxid: string): Promise<Gql.EdgeAddon>;
 }
@@ -34,6 +37,7 @@ export function createEdgeApi(): EdgeApi {
   });
 
   const getAddon: EdgeApi["getAddon"] = async (crxid) => {
+    logger.info("Get addon", { crxid });
     const res = await fetch(
       `https://microsoftedge.microsoft.com/addons/getproductdetailsbycrxid/${crxid}`,
     );
@@ -42,6 +46,7 @@ export function createEdgeApi(): EdgeApi {
     }
 
     const json = (await res.json()) as GetProductDetailsByCrxId200Response;
+    logger.debug("Addon result", { crxid, json });
 
     return toGqlEdgeAddon(json);
   };