From db4fae3a3348354a2502bf46fc7d60f014f00051 Mon Sep 17 00:00:00 2001 From: SukkaW Date: Thu, 11 Jul 2024 23:20:42 +0800 Subject: [PATCH 1/7] refactor: replace `ansi-escapes` w/ `sisteransi` --- package.json | 4 ++-- pnpm-lock.yaml | 22 +++++++--------------- src/utils/log-update.ts | 6 +++--- 3 files changed, 12 insertions(+), 20 deletions(-) diff --git a/package.json b/package.json index 67f045b..bc54b1b 100644 --- a/package.json +++ b/package.json @@ -30,12 +30,12 @@ "test": "pnpm lint && mocha ./test/*.test.*" }, "dependencies": { - "ansi-escapes": "^4.3.2", "chalk": "^4.1.2", "consola": "^3.2.3", "figures": "^3.2.0", "markdown-table": "^2.0.0", "pretty-time": "^1.1.0", + "sisteransi": "^1.0.5", "std-env": "^3.7.0", "wrap-ansi": "^7.0.0" }, @@ -60,4 +60,4 @@ "engines": { "node": ">=14.21.3" } -} \ No newline at end of file +} diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index e6b7e9f..69db7a3 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -5,9 +5,6 @@ settings: excludeLinksFromLockfile: false dependencies: - ansi-escapes: - specifier: ^4.3.2 - version: 4.3.2 chalk: specifier: ^4.1.2 version: 4.1.2 @@ -23,6 +20,9 @@ dependencies: pretty-time: specifier: ^1.1.0 version: 1.1.0 + sisteransi: + specifier: ^1.0.5 + version: 1.0.5 std-env: specifier: ^3.7.0 version: 3.7.0 @@ -1083,13 +1083,6 @@ packages: engines: {node: '>=6'} dev: true - /ansi-escapes@4.3.2: - resolution: {integrity: sha512-gKXj5ALrKWQLsYG9jlTRmR/xKluxHV+Z9QEwNIgCfM1/uwPMCuzVVnh5mwTd+OuBZcwSIMbqssNWRm1lE51QaQ==} - engines: {node: '>=8'} - dependencies: - type-fest: 0.21.3 - dev: false - /ansi-regex@5.0.1: resolution: {integrity: sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==} engines: {node: '>=8'} @@ -4326,6 +4319,10 @@ packages: engines: {node: '>=14'} dev: true + /sisteransi@1.0.5: + resolution: {integrity: sha512-bLGGlR1QxBcynn2d5YmDX4MGjlZvy2MRBDRNHLJ8VI6l6+9FUiyTFNJ0IveOSP0bcXgVDPRcfGqA0pjaqUpfVg==} + dev: false + /slash@3.0.0: resolution: {integrity: sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==} engines: {node: '>=8'} @@ -4609,11 +4606,6 @@ packages: engines: {node: '>=10'} dev: true - /type-fest@0.21.3: - resolution: {integrity: sha512-t0rzBq87m3fVcduHDUFhKmyyX+9eo6WQjZvf51Ea/M0Q7+T374Jp1aUiyUl0GKxp8M/OETVHSDvmkyPgvX+X2w==} - engines: {node: '>=10'} - dev: false - /type-fest@0.6.0: resolution: {integrity: sha512-q+MB8nYR1KDLrgr4G5yemftpMC7/QLqVndBmEEdqzmNj5dcFOO4Oo8qlwZE3ULT3+Zim1F8Kq4cBnikNhlCMlg==} engines: {node: '>=8'} diff --git a/src/utils/log-update.ts b/src/utils/log-update.ts index a4ac765..9a828c3 100644 --- a/src/utils/log-update.ts +++ b/src/utils/log-update.ts @@ -1,4 +1,4 @@ -import ansiEscapes from "ansi-escapes"; +import sisteransi from "sisteransi" import wrapAnsi from "wrap-ansi"; // Based on https://github.com/sindresorhus/log-update/blob/master/index.js @@ -29,7 +29,7 @@ export default class LogUpdate { }); const data = - ansiEscapes.eraseLines(this.prevLineCount) + + sisteransi.erase.lines(this.prevLineCount) + wrappedLines + "\n" + this.extraLines; @@ -60,7 +60,7 @@ export default class LogUpdate { clear() { this.done(); - this.write(ansiEscapes.eraseLines(this.prevLineCount)); + this.write(sisteransi.erase.lines(this.prevLineCount)); } done() { From d3ee08534ad17cf27b0faa7096b04de10bcd6e75 Mon Sep 17 00:00:00 2001 From: SukkaW Date: Thu, 11 Jul 2024 23:25:12 +0800 Subject: [PATCH 2/7] refactor: replace `chalk` w/ `ansis` --- package.json | 2 +- playground/index.mjs | 2 +- pnpm-lock.yaml | 14 +++++++++++--- src/profiler/format.ts | 4 ++-- src/reporters/fancy.ts | 10 +++++----- src/reporters/profile.ts | 4 ++-- src/utils/cli.ts | 8 ++++---- src/utils/consts.ts | 4 ++-- test/fixture/index.cjs | 2 +- 9 files changed, 29 insertions(+), 21 deletions(-) diff --git a/package.json b/package.json index bc54b1b..ea11330 100644 --- a/package.json +++ b/package.json @@ -30,7 +30,7 @@ "test": "pnpm lint && mocha ./test/*.test.*" }, "dependencies": { - "chalk": "^4.1.2", + "ansis": "^3.2.0", "consola": "^3.2.3", "figures": "^3.2.0", "markdown-table": "^2.0.0", diff --git a/playground/index.mjs b/playground/index.mjs index ce216e8..8de40a9 100644 --- a/playground/index.mjs +++ b/playground/index.mjs @@ -1,2 +1,2 @@ // eslint-disable-next-line unicorn/import-style -import "chalk"; +import "ansis"; diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 69db7a3..ef013a9 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -5,9 +5,9 @@ settings: excludeLinksFromLockfile: false dependencies: - chalk: - specifier: ^4.1.2 - version: 4.1.2 + ansis: + specifier: ^3.2.0 + version: 3.2.0 consola: specifier: ^3.2.3 version: 3.2.3 @@ -1101,6 +1101,11 @@ packages: dependencies: color-convert: 2.0.1 + /ansis@3.2.0: + resolution: {integrity: sha512-Yk3BkHH9U7oPyCN3gL5Tc7CpahG/+UFv/6UG03C311Vy9lzRmA5uoxDTpU9CO3rGHL6KzJz/pdDeXZCZ5Mu/Sg==} + engines: {node: '>=15'} + dev: false + /anymatch@3.1.3: resolution: {integrity: sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==} engines: {node: '>= 8'} @@ -1348,6 +1353,7 @@ packages: dependencies: ansi-styles: 4.3.0 supports-color: 7.2.0 + dev: true /chalk@5.3.0: resolution: {integrity: sha512-dLitG79d+GV1Nb/VYcCDFivJeK1hiukt9QjRNVOsUtTy1rR1YJsmpGGTZ3qJos+uw7WmWF4wUwBd9jxjocFC2w==} @@ -2666,6 +2672,7 @@ packages: /has-flag@4.0.0: resolution: {integrity: sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==} engines: {node: '>=8'} + dev: true /has-property-descriptors@1.0.1: resolution: {integrity: sha512-VsX8eaIewvas0xnvinAe9bw4WfIeODpGYikiWYLH+dma0Jw6KHYqWiWfhQlgOVK8D6PvjubK5Uc4P0iIhIcNVg==} @@ -4471,6 +4478,7 @@ packages: engines: {node: '>=8'} dependencies: has-flag: 4.0.0 + dev: true /supports-color@8.1.1: resolution: {integrity: sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==} diff --git a/src/profiler/format.ts b/src/profiler/format.ts index e8e971b..165e761 100644 --- a/src/profiler/format.ts +++ b/src/profiler/format.ts @@ -1,5 +1,5 @@ import prettyTime from "pretty-time"; -import chalk from "chalk"; +import ansis from "ansis"; import { startCase } from "../utils"; import { createTable } from "../utils/cli"; @@ -12,7 +12,7 @@ export default function formatStats(allStats) { for (const category of Object.keys(allStats)) { const stats = allStats[category]; - lines.push(`> Stats by ${chalk.bold(startCase(category))}`); + lines.push(`> Stats by ${ansis.bold(startCase(category))}`); let totalRequests = 0; const totalTime = [0, 0]; diff --git a/src/reporters/fancy.ts b/src/reporters/fancy.ts index 3ed0337..d0f76ae 100644 --- a/src/reporters/fancy.ts +++ b/src/reporters/fancy.ts @@ -1,5 +1,5 @@ /* eslint-disable no-console */ -import chalk from "chalk"; +import ansis from "ansis"; import { renderBar, colorize, ellipsisLeft } from "../utils/cli"; import { formatRequest } from "../utils/webpack"; @@ -54,13 +54,13 @@ export default class FancyReporter implements Reporter { renderBar(state.progress, state.color), state.message, `(${state.progress || 0}%)`, - chalk.grey(state.details[0] || ""), - chalk.grey(state.details[1] || ""), + ansis.grey(state.details[0] || ""), + ansis.grey(state.details[1] || ""), ].join(" "); line2 = state.request ? " " + - chalk.grey( + ansis.grey( ellipsisLeft(formatRequest(state.request), logUpdate.columns), ) : ""; @@ -76,7 +76,7 @@ export default class FancyReporter implements Reporter { } line1 = color(`${icon} ${state.name}`); - line2 = chalk.grey(" " + state.message); + line2 = ansis.grey(" " + state.message); } return line1 + "\n" + line2; diff --git a/src/reporters/profile.ts b/src/reporters/profile.ts index cce2b90..f73e4b5 100644 --- a/src/reporters/profile.ts +++ b/src/reporters/profile.ts @@ -1,4 +1,4 @@ -import chalk from "chalk"; +import ansis from "ansis"; import { colorize } from "../utils/cli"; import Profiler from "../profiler"; @@ -28,7 +28,7 @@ export default class ProfileReporter implements Reporter { if (state.profile) { str += - color(`\nProfile results for ${chalk.bold(state.name)}\n`) + + color(`\nProfile results for ${ansis.bold(state.name)}\n`) + `\n${state.profile}\n`; delete state.profile; } diff --git a/src/utils/cli.ts b/src/utils/cli.ts index c7f34de..932c804 100644 --- a/src/utils/cli.ts +++ b/src/utils/cli.ts @@ -1,4 +1,4 @@ -import chalk from "chalk"; +import ansis from "ansis"; import { consola as _consola } from "consola"; import markdownTable from "markdown-table"; @@ -10,15 +10,15 @@ export const consola = _consola.withTag("webpackbar"); export const colorize = (color) => { if (color[0] === "#") { - return chalk.hex(color); + return ansis.hex(color); } - return chalk[color] || chalk.reset; // || chalk.keyword(color); + return ansis[color] || ansis.reset; // || ansis.keyword(color); }; export const renderBar = (progress, color) => { const w = progress * (BAR_LENGTH / 100); - const bg = chalk.white(BLOCK_CHAR); + const bg = ansis.white(BLOCK_CHAR); const fg = colorize(color)(BLOCK_CHAR2); return range(BAR_LENGTH) diff --git a/src/utils/consts.ts b/src/utils/consts.ts index 26ea368..a619ecd 100644 --- a/src/utils/consts.ts +++ b/src/utils/consts.ts @@ -1,7 +1,7 @@ import { delimiter } from "node:path"; import figures from "figures"; -import chalk from "chalk"; +import ansis from "ansis"; const { bullet, tick, cross, pointerSmall, radioOff } = figures; @@ -9,7 +9,7 @@ export const nodeModules = `${delimiter}node_modules${delimiter}`; export const BAR_LENGTH = 25; export const BLOCK_CHAR = "█"; export const BLOCK_CHAR2 = "█"; -export const NEXT = " " + chalk.blue(pointerSmall) + " "; +export const NEXT = " " + ansis.blue(pointerSmall) + " "; export const BULLET = bullet; export const TICK = tick; export const CROSS = cross; diff --git a/test/fixture/index.cjs b/test/fixture/index.cjs index 09ea4bf..fab42a3 100644 --- a/test/fixture/index.cjs +++ b/test/fixture/index.cjs @@ -1 +1 @@ -require("chalk"); +require("ansis"); From 6dad4f32f7c1ec5fef0e9bc58197a662afcc51af Mon Sep 17 00:00:00 2001 From: SukkaW Date: Thu, 11 Jul 2024 23:25:40 +0800 Subject: [PATCH 3/7] chore: make eslint happy --- src/utils/log-update.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/utils/log-update.ts b/src/utils/log-update.ts index 9a828c3..29e22d4 100644 --- a/src/utils/log-update.ts +++ b/src/utils/log-update.ts @@ -1,4 +1,4 @@ -import sisteransi from "sisteransi" +import sisteransi from "sisteransi"; import wrapAnsi from "wrap-ansi"; // Based on https://github.com/sindresorhus/log-update/blob/master/index.js From 638c725312efed8531b3b22ce4878ca0f6380cb6 Mon Sep 17 00:00:00 2001 From: SukkaW Date: Wed, 17 Jul 2024 00:52:37 +0800 Subject: [PATCH 4/7] refactor: prefer consola/utils when possible --- src/profiler/format.ts | 6 ++++-- src/reporters/fancy.ts | 12 +++++++----- src/reporters/profile.ts | 7 ++++--- src/utils/cli.ts | 13 ++++++++----- src/utils/consts.ts | 5 +++-- 5 files changed, 26 insertions(+), 17 deletions(-) diff --git a/src/profiler/format.ts b/src/profiler/format.ts index 165e761..9526d90 100644 --- a/src/profiler/format.ts +++ b/src/profiler/format.ts @@ -1,18 +1,20 @@ import prettyTime from "pretty-time"; -import ansis from "ansis"; +import { getColor } from "consola/utils"; import { startCase } from "../utils"; import { createTable } from "../utils/cli"; import getDescription from "./description"; +const bold = getColor("bold") + export default function formatStats(allStats) { const lines = []; for (const category of Object.keys(allStats)) { const stats = allStats[category]; - lines.push(`> Stats by ${ansis.bold(startCase(category))}`); + lines.push(`> Stats by ${bold(startCase(category))}`); let totalRequests = 0; const totalTime = [0, 0]; diff --git a/src/reporters/fancy.ts b/src/reporters/fancy.ts index d0f76ae..cf5a601 100644 --- a/src/reporters/fancy.ts +++ b/src/reporters/fancy.ts @@ -1,6 +1,6 @@ /* eslint-disable no-console */ -import ansis from "ansis"; +import { getColor } from "consola/utils"; import { renderBar, colorize, ellipsisLeft } from "../utils/cli"; import { formatRequest } from "../utils/webpack"; import { BULLET, TICK, CROSS, CIRCLE_OPEN } from "../utils/consts"; @@ -11,6 +11,8 @@ const logUpdate = new LogUpdate(); let lastRender = Date.now(); +const grey = getColor("gray") + export default class FancyReporter implements Reporter { allDone() { logUpdate.done(); @@ -54,13 +56,13 @@ export default class FancyReporter implements Reporter { renderBar(state.progress, state.color), state.message, `(${state.progress || 0}%)`, - ansis.grey(state.details[0] || ""), - ansis.grey(state.details[1] || ""), + grey(state.details[0] || ""), + grey(state.details[1] || ""), ].join(" "); line2 = state.request ? " " + - ansis.grey( + grey( ellipsisLeft(formatRequest(state.request), logUpdate.columns), ) : ""; @@ -76,7 +78,7 @@ export default class FancyReporter implements Reporter { } line1 = color(`${icon} ${state.name}`); - line2 = ansis.grey(" " + state.message); + line2 = grey(" " + state.message); } return line1 + "\n" + line2; diff --git a/src/reporters/profile.ts b/src/reporters/profile.ts index f73e4b5..39e46d0 100644 --- a/src/reporters/profile.ts +++ b/src/reporters/profile.ts @@ -1,9 +1,10 @@ -import ansis from "ansis"; - +import { getColor } from "consola/utils"; import { colorize } from "../utils/cli"; import Profiler from "../profiler"; import { Reporter } from "../types"; +const bold = getColor("bold"); + export default class ProfileReporter implements Reporter { progress(context) { if (!context.state.profiler) { @@ -28,7 +29,7 @@ export default class ProfileReporter implements Reporter { if (state.profile) { str += - color(`\nProfile results for ${ansis.bold(state.name)}\n`) + + color(`\nProfile results for ${bold(state.name)}\n`) + `\n${state.profile}\n`; delete state.profile; } diff --git a/src/utils/cli.ts b/src/utils/cli.ts index 932c804..203111c 100644 --- a/src/utils/cli.ts +++ b/src/utils/cli.ts @@ -1,24 +1,27 @@ -import ansis from "ansis"; +import { hex } from "ansis"; import { consola as _consola } from "consola"; import markdownTable from "markdown-table"; +import { getColor, type ColorName } from "consola/utils"; import { BLOCK_CHAR, BLOCK_CHAR2, BAR_LENGTH } from "./consts"; import { range } from "."; export const consola = _consola.withTag("webpackbar"); -export const colorize = (color) => { +export const colorize = (color: ColorName | `#${string}`) => { if (color[0] === "#") { - return ansis.hex(color); + return hex(color); } - return ansis[color] || ansis.reset; // || ansis.keyword(color); + return getColor(color as ColorName); // || ansis.keyword(color); }; +const white = getColor("white") + export const renderBar = (progress, color) => { const w = progress * (BAR_LENGTH / 100); - const bg = ansis.white(BLOCK_CHAR); + const bg = white(BLOCK_CHAR); const fg = colorize(color)(BLOCK_CHAR2); return range(BAR_LENGTH) diff --git a/src/utils/consts.ts b/src/utils/consts.ts index a619ecd..e794bb2 100644 --- a/src/utils/consts.ts +++ b/src/utils/consts.ts @@ -1,15 +1,16 @@ import { delimiter } from "node:path"; import figures from "figures"; -import ansis from "ansis"; +import { getColor } from "consola/utils"; const { bullet, tick, cross, pointerSmall, radioOff } = figures; +const blue = getColor("blue"); export const nodeModules = `${delimiter}node_modules${delimiter}`; export const BAR_LENGTH = 25; export const BLOCK_CHAR = "█"; export const BLOCK_CHAR2 = "█"; -export const NEXT = " " + ansis.blue(pointerSmall) + " "; +export const NEXT = " " + blue(pointerSmall) + " "; export const BULLET = bullet; export const TICK = tick; export const CROSS = cross; From 8c88dfdb5fe24c19510bf0d15ecc35587066305b Mon Sep 17 00:00:00 2001 From: Pooya Parsa Date: Wed, 6 Nov 2024 12:59:48 +0100 Subject: [PATCH 5/7] revert fixture --- test/fixture/index.cjs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/test/fixture/index.cjs b/test/fixture/index.cjs index fab42a3..09ea4bf 100644 --- a/test/fixture/index.cjs +++ b/test/fixture/index.cjs @@ -1 +1 @@ -require("ansis"); +require("chalk"); From d23d55f28381f889068e410f7945c564bdfda404 Mon Sep 17 00:00:00 2001 From: Pooya Parsa Date: Wed, 6 Nov 2024 13:16:45 +0100 Subject: [PATCH 6/7] inline eraseLines --- package.json | 1 - playground/webpack.config.mjs | 4 ++++ pnpm-lock.yaml | 8 -------- src/utils/cli.ts | 12 +++++++++++- src/utils/log-update.ts | 9 +++------ 5 files changed, 18 insertions(+), 16 deletions(-) diff --git a/package.json b/package.json index 57ff364..af07df8 100644 --- a/package.json +++ b/package.json @@ -35,7 +35,6 @@ "figures": "^6.1.0", "markdown-table": "^3.0.4", "pretty-time": "^1.1.0", - "sisteransi": "^1.0.5", "std-env": "^3.7.0", "wrap-ansi": "^9.0.0" }, diff --git a/playground/webpack.config.mjs b/playground/webpack.config.mjs index 735cc70..2016151 100644 --- a/playground/webpack.config.mjs +++ b/playground/webpack.config.mjs @@ -38,4 +38,8 @@ const config = (name, color) => ({ ], }); +setInterval(() => { + console.log(`[${new Date().toLocaleTimeString()}]`); +}, 1000).unref(); + export default [config("chalk", "cyan"), config("babel", "yellow")]; diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index e0c6c6d..47dbb97 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -23,9 +23,6 @@ importers: pretty-time: specifier: ^1.1.0 version: 1.1.0 - sisteransi: - specifier: ^1.0.5 - version: 1.0.5 std-env: specifier: ^3.7.0 version: 3.7.0 @@ -2308,9 +2305,6 @@ packages: resolution: {integrity: sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==} engines: {node: '>=14'} - sisteransi@1.0.5: - resolution: {integrity: sha512-bLGGlR1QxBcynn2d5YmDX4MGjlZvy2MRBDRNHLJ8VI6l6+9FUiyTFNJ0IveOSP0bcXgVDPRcfGqA0pjaqUpfVg==} - slash@4.0.0: resolution: {integrity: sha512-3dOsAHXXUkQTpOYcoAxLIorMTp4gIQr5IW3iVb7A7lFIp0VHhnynm9izx6TssdrIcVIESAlVjtnO2K8bg+Coew==} engines: {node: '>=12'} @@ -4771,8 +4765,6 @@ snapshots: signal-exit@4.1.0: {} - sisteransi@1.0.5: {} - slash@4.0.0: {} slash@5.1.0: {} diff --git a/src/utils/cli.ts b/src/utils/cli.ts index 203111c..cbddfca 100644 --- a/src/utils/cli.ts +++ b/src/utils/cli.ts @@ -17,7 +17,7 @@ export const colorize = (color: ColorName | `#${string}`) => { return getColor(color as ColorName); // || ansis.keyword(color); }; -const white = getColor("white") +const white = getColor("white"); export const renderBar = (progress, color) => { const w = progress * (BAR_LENGTH / 100); @@ -46,3 +46,13 @@ export function ellipsisLeft(str, n) { } return `...${str.slice(str.length - n - 1)}`; } + +// Based on github.com/terkelg/sisteransi (MIT - 2018 Terkel Gjervig Nielsen) +export function eraseLines(count: number) { + let clear = ""; + for (let i = 0; i < count; i++) { + clear += `\u001B[2K` + (i < count - 1 ? `\u001B[1A` : ""); + } + if (count) clear += `\u001B[G`; + return clear; +} diff --git a/src/utils/log-update.ts b/src/utils/log-update.ts index 29e22d4..8350631 100644 --- a/src/utils/log-update.ts +++ b/src/utils/log-update.ts @@ -1,5 +1,5 @@ -import sisteransi from "sisteransi"; import wrapAnsi from "wrap-ansi"; +import { eraseLines } from "./cli"; // Based on https://github.com/sindresorhus/log-update/blob/master/index.js @@ -29,10 +29,7 @@ export default class LogUpdate { }); const data = - sisteransi.erase.lines(this.prevLineCount) + - wrappedLines + - "\n" + - this.extraLines; + eraseLines(this.prevLineCount) + wrappedLines + "\n" + this.extraLines; this.write(data); @@ -60,7 +57,7 @@ export default class LogUpdate { clear() { this.done(); - this.write(sisteransi.erase.lines(this.prevLineCount)); + this.write(eraseLines(this.prevLineCount)); } done() { From f643eadd5e0675af3982e1f6c1b575aa787a543b Mon Sep 17 00:00:00 2001 From: Pooya Parsa Date: Wed, 6 Nov 2024 13:24:17 +0100 Subject: [PATCH 7/7] prefer ansis utils for consistency --- src/profiler/format.ts | 5 +---- src/reporters/fancy.ts | 4 +--- src/reporters/profile.ts | 4 +--- src/utils/cli.ts | 15 ++++----------- src/utils/consts.ts | 4 +--- 5 files changed, 8 insertions(+), 24 deletions(-) diff --git a/src/profiler/format.ts b/src/profiler/format.ts index 9526d90..bdcb3b7 100644 --- a/src/profiler/format.ts +++ b/src/profiler/format.ts @@ -1,13 +1,10 @@ import prettyTime from "pretty-time"; - -import { getColor } from "consola/utils"; +import { bold } from "ansis"; import { startCase } from "../utils"; import { createTable } from "../utils/cli"; import getDescription from "./description"; -const bold = getColor("bold") - export default function formatStats(allStats) { const lines = []; diff --git a/src/reporters/fancy.ts b/src/reporters/fancy.ts index f721462..82b091e 100644 --- a/src/reporters/fancy.ts +++ b/src/reporters/fancy.ts @@ -1,4 +1,4 @@ -import { getColor } from "consola/utils"; +import { grey } from "ansis"; import { renderBar, colorize, ellipsisLeft } from "../utils/cli"; import { formatRequest } from "../utils/webpack"; import { BULLET, TICK, CROSS, CIRCLE_OPEN } from "../utils/consts"; @@ -9,8 +9,6 @@ const logUpdate = new LogUpdate(); let lastRender = Date.now(); -const grey = getColor("gray"); - export default class FancyReporter implements Reporter { allDone() { logUpdate.done(); diff --git a/src/reporters/profile.ts b/src/reporters/profile.ts index 39e46d0..130ef09 100644 --- a/src/reporters/profile.ts +++ b/src/reporters/profile.ts @@ -1,10 +1,8 @@ -import { getColor } from "consola/utils"; +import { bold } from "ansis"; import { colorize } from "../utils/cli"; import Profiler from "../profiler"; import { Reporter } from "../types"; -const bold = getColor("bold"); - export default class ProfileReporter implements Reporter { progress(context) { if (!context.state.profiler) { diff --git a/src/utils/cli.ts b/src/utils/cli.ts index cbddfca..fabb422 100644 --- a/src/utils/cli.ts +++ b/src/utils/cli.ts @@ -1,27 +1,20 @@ -import { hex } from "ansis"; +import c from "ansis"; import { consola as _consola } from "consola"; import markdownTable from "markdown-table"; -import { getColor, type ColorName } from "consola/utils"; import { BLOCK_CHAR, BLOCK_CHAR2, BAR_LENGTH } from "./consts"; import { range } from "."; export const consola = _consola.withTag("webpackbar"); -export const colorize = (color: ColorName | `#${string}`) => { - if (color[0] === "#") { - return hex(color); - } - - return getColor(color as ColorName); // || ansis.keyword(color); +export const colorize = (color: string) => { + return color[0] === "#" ? c.hex(color) : c[color] || c.reset; }; -const white = getColor("white"); - export const renderBar = (progress, color) => { const w = progress * (BAR_LENGTH / 100); - const bg = white(BLOCK_CHAR); + const bg = c.white(BLOCK_CHAR); const fg = colorize(color)(BLOCK_CHAR2); return range(BAR_LENGTH) diff --git a/src/utils/consts.ts b/src/utils/consts.ts index e794bb2..7867fff 100644 --- a/src/utils/consts.ts +++ b/src/utils/consts.ts @@ -1,10 +1,8 @@ import { delimiter } from "node:path"; - import figures from "figures"; -import { getColor } from "consola/utils"; +import { blue } from "ansis"; const { bullet, tick, cross, pointerSmall, radioOff } = figures; -const blue = getColor("blue"); export const nodeModules = `${delimiter}node_modules${delimiter}`; export const BAR_LENGTH = 25;