From 89cb7ea600c4daa92b9b3b26239124ce89f53f07 Mon Sep 17 00:00:00 2001 From: Alex Hunt Date: Mon, 9 Jun 2025 18:21:18 -0700 Subject: [PATCH] Replace remaining uses of chalk (#51906) Summary: Pull Request resolved: https://github.com/facebook/react-native/pull/51906 Replaces `chalk` with Node's `util.styleText` in all remaining files, removing this dependency from our repo. Changelog: [Internal] Reviewed By: robhogan Differential Revision: D76273414 fbshipit-source-id: 401f338e55c6f7abb38ee72d45b921f686440663 --- flow-typed/npm/chalk_v4.x.x.js | 230 ------------------ package.json | 1 - scripts/debugger-frontend/sync-and-build.js | 13 +- scripts/e2e/init-project-e2e.js | 9 +- scripts/release-testing/test-e2e-local.js | 9 +- .../utils/github-actions-utils.js | 13 +- tools/api/package.json | 1 - tools/api/public-api.js | 8 +- 8 files changed, 29 insertions(+), 255 deletions(-) delete mode 100644 flow-typed/npm/chalk_v4.x.x.js diff --git a/flow-typed/npm/chalk_v4.x.x.js b/flow-typed/npm/chalk_v4.x.x.js deleted file mode 100644 index ffe94fe1534..00000000000 --- a/flow-typed/npm/chalk_v4.x.x.js +++ /dev/null @@ -1,230 +0,0 @@ -/** - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - * @flow - * @format - */ - -// flow-typed signature: 79cfa6bcaa67fdb60f10d320da0470fc -// flow-typed version: 6cecea2e51/chalk_v4.x.x/flow_>=v0.104.x - -// From: https://github.com/chalk/chalk/blob/master/index.d.ts - -declare module 'chalk' { - declare type ForegroundColor = - | 'black' - | 'red' - | 'green' - | 'yellow' - | 'blue' - | 'magenta' - | 'cyan' - | 'white' - | 'gray' - | 'grey' - | 'blackBright' - | 'redBright' - | 'greenBright' - | 'yellowBright' - | 'blueBright' - | 'magentaBright' - | 'cyanBright' - | 'whiteBright'; - - declare type BackgroundColor = - | 'bgBlack' - | 'bgRed' - | 'bgGreen' - | 'bgYellow' - | 'bgBlue' - | 'bgMagenta' - | 'bgCyan' - | 'bgWhite' - | 'bgGray' - | 'bgGrey' - | 'bgBlackBright' - | 'bgRedBright' - | 'bgGreenBright' - | 'bgYellowBright' - | 'bgBlueBright' - | 'bgMagentaBright' - | 'bgCyanBright' - | 'bgWhiteBright'; - - declare type Color = ForegroundColor | BackgroundColor; - - declare type Modifiers = - | 'reset' - | 'bold' - | 'dim' - | 'italic' - | 'underline' - | 'inverse' - | 'hidden' - | 'strikethrough' - | 'visible'; - - declare type TemplateStringsArray = $ReadOnlyArray; - - declare type Level = $Values<{ - None: 0, - Basic: 1, - Ansi256: 2, - TrueColor: 3, - ... - }>; - - declare type ChalkOptions = {| - level?: Level, - |}; - - declare type ColorSupport = {| - level: Level, - hasBasic: boolean, - has256: boolean, - has16m: boolean, - |}; - - declare class Instance implements Chalk { - constructor(options?: ChalkOptions): this; - - (...text: string[]): string; - (text: TemplateStringsArray, ...placeholders: string[]): string; - Instance: typeof Instance; - level: Level; - rgb(r: number, g: number, b: number): Chalk; - hsl(h: number, s: number, l: number): Chalk; - hsv(h: number, s: number, v: number): Chalk; - hwb(h: number, w: number, b: number): Chalk; - bgHex(color: string): Chalk; - bgKeyword(color: string): Chalk; - bgRgb(r: number, g: number, b: number): Chalk; - bgHsl(h: number, s: number, l: number): Chalk; - bgHsv(h: number, s: number, v: number): Chalk; - bgHwb(h: number, w: number, b: number): Chalk; - hex(color: string): Chalk; - keyword(color: string): Chalk; - - +reset: Chalk; - +bold: Chalk; - +dim: Chalk; - +italic: Chalk; - +underline: Chalk; - +inverse: Chalk; - +hidden: Chalk; - +strikethrough: Chalk; - - +visible: Chalk; - - +black: Chalk; - +red: Chalk; - +green: Chalk; - +yellow: Chalk; - +blue: Chalk; - +magenta: Chalk; - +cyan: Chalk; - +white: Chalk; - +gray: Chalk; - +grey: Chalk; - +blackBright: Chalk; - +redBright: Chalk; - +greenBright: Chalk; - +yellowBright: Chalk; - +blueBright: Chalk; - +magentaBright: Chalk; - +cyanBright: Chalk; - +whiteBright: Chalk; - - +bgBlack: Chalk; - +bgRed: Chalk; - +bgGreen: Chalk; - +bgYellow: Chalk; - +bgBlue: Chalk; - +bgMagenta: Chalk; - +bgCyan: Chalk; - +bgWhite: Chalk; - +bgBlackBright: Chalk; - +bgRedBright: Chalk; - +bgGreenBright: Chalk; - +bgYellowBright: Chalk; - +bgBlueBright: Chalk; - +bgMagentaBright: Chalk; - +bgCyanBright: Chalk; - +bgWhiteBright: Chalk; - - supportsColor: ColorSupport; - } - - declare interface Chalk { - (...text: string[]): string; - (text: TemplateStringsArray, ...placeholders: string[]): string; - Instance: typeof Instance; - level: Level; - rgb(r: number, g: number, b: number): Chalk; - hsl(h: number, s: number, l: number): Chalk; - hsv(h: number, s: number, v: number): Chalk; - hwb(h: number, w: number, b: number): Chalk; - bgHex(color: string): Chalk; - bgKeyword(color: string): Chalk; - bgRgb(r: number, g: number, b: number): Chalk; - bgHsl(h: number, s: number, l: number): Chalk; - bgHsv(h: number, s: number, v: number): Chalk; - bgHwb(h: number, w: number, b: number): Chalk; - hex(color: string): Chalk; - keyword(color: string): Chalk; - - +reset: Chalk; - +bold: Chalk; - +dim: Chalk; - +italic: Chalk; - +underline: Chalk; - +inverse: Chalk; - +hidden: Chalk; - +strikethrough: Chalk; - - +visible: Chalk; - - +black: Chalk; - +red: Chalk; - +green: Chalk; - +yellow: Chalk; - +blue: Chalk; - +magenta: Chalk; - +cyan: Chalk; - +white: Chalk; - +gray: Chalk; - +grey: Chalk; - +blackBright: Chalk; - +redBright: Chalk; - +greenBright: Chalk; - +yellowBright: Chalk; - +blueBright: Chalk; - +magentaBright: Chalk; - +cyanBright: Chalk; - +whiteBright: Chalk; - - +bgBlack: Chalk; - +bgRed: Chalk; - +bgGreen: Chalk; - +bgYellow: Chalk; - +bgBlue: Chalk; - +bgMagenta: Chalk; - +bgCyan: Chalk; - +bgWhite: Chalk; - +bgBlackBright: Chalk; - +bgRedBright: Chalk; - +bgGreenBright: Chalk; - +bgYellowBright: Chalk; - +bgBlueBright: Chalk; - +bgMagentaBright: Chalk; - +bgCyanBright: Chalk; - +bgWhiteBright: Chalk; - - supportsColor: ColorSupport; - } - - declare module.exports: Chalk; -} diff --git a/package.json b/package.json index 36f49e7c4d4..3e34e5985dd 100644 --- a/package.json +++ b/package.json @@ -62,7 +62,6 @@ "babel-plugin-syntax-hermes-parser": "0.28.1", "babel-plugin-transform-define": "^2.1.4", "babel-plugin-transform-flow-enums": "^0.0.2", - "chalk": "^4.0.0", "clang-format": "^1.8.0", "connect": "^3.6.5", "debug": "^4.4.0", diff --git a/scripts/debugger-frontend/sync-and-build.js b/scripts/debugger-frontend/sync-and-build.js index 80a21438664..ccbf62222c6 100644 --- a/scripts/debugger-frontend/sync-and-build.js +++ b/scripts/debugger-frontend/sync-and-build.js @@ -11,7 +11,6 @@ const {PACKAGES_DIR} = require('../consts'); // $FlowFixMe[untyped-import]: TODO type ansi-styles const ansiStyles = require('ansi-styles'); -const chalk = require('chalk'); const {execSync, spawnSync} = require('child_process'); const {promises: fs} = require('fs'); const nullthrows = require('nullthrows'); @@ -23,7 +22,7 @@ const rimraf = require('rimraf'); const SignedSource = require('signedsource'); // $FlowFixMe[untyped-import]: TODO type supports-color const supportsColor = require('supports-color'); -const {parseArgs} = require('util'); +const {parseArgs, styleText} = require('util'); const DEVTOOLS_FRONTEND_REPO_URL = 'https://github.com/facebook/react-native-devtools-frontend'; @@ -76,7 +75,7 @@ async function main() { const localCheckoutPath = positionals?.[0]; if (branch == null && !localCheckoutPath?.length) { - console.error(chalk.red('Error: Missing option --branch')); + console.error(styleText('red', 'Error: Missing option --branch')); showHelp(); process.exitCode = 1; return; @@ -84,7 +83,7 @@ async function main() { console.log( '\n' + - chalk.bold.inverse('Syncing debugger-frontend') + + styleText(['bold', 'inverse'], 'Syncing debugger-frontend') + (noBuild ? ' (--no-build)' : '') + '\n', ); @@ -92,7 +91,7 @@ async function main() { const scratchPath = await fs.mkdtemp( path.join(tmpdir(), 'debugger-frontend-build-'), ); - process.stdout.write(chalk.dim(`Scratch path: ${scratchPath}\n\n`)); + process.stdout.write(styleText('dim', `Scratch path: ${scratchPath}\n\n`)); await checkRequiredTools(); const packagePath = path.join(PACKAGES_DIR, 'debugger-frontend'); @@ -116,7 +115,7 @@ async function main() { await cleanup(scratchPath, keepScratch === true); if (!noBuild) { process.stdout.write( - chalk.green('Sync done.') + + styleText('green', 'Sync done.') + ' Check in any updated files under packages/debugger-frontend.\n', ); } @@ -293,7 +292,7 @@ async function performReleaseBuild( }, ); const gnArgsSummary = gnArgsStdout.toString().trim(); - process.stdout.write(chalk.dim(gnArgsSummary) + '\n'); + process.stdout.write(styleText('dim', gnArgsSummary) + '\n'); await spawnSafe('autoninja', ['-C', 'out/Release'], {cwd: checkoutPath}); process.stdout.write('\n'); return {gnArgsSummary, buildPath}; diff --git a/scripts/e2e/init-project-e2e.js b/scripts/e2e/init-project-e2e.js index 6b47eae6399..1b83e10cb24 100644 --- a/scripts/e2e/init-project-e2e.js +++ b/scripts/e2e/init-project-e2e.js @@ -20,12 +20,11 @@ const { VERDACCIO_STORAGE_PATH, setupVerdaccio, } = require('./utils/verdaccio'); -const chalk = require('chalk'); const {execSync} = require('child_process'); const fs = require('fs'); const path = require('path'); const {popd, pushd} = require('shelljs'); -const {parseArgs} = require('util'); +const {parseArgs, styleText} = require('util'); const config = { options: { @@ -120,7 +119,7 @@ async function initNewProjectFromSource( packagePath, )})`; process.stdout.write( - `${desc} ${chalk.dim('.').repeat(Math.max(0, 72 - desc.length))} `, + `${desc} ${styleText('dim', '.').repeat(Math.max(0, 72 - desc.length))} `, ); execSync( `npm publish --registry ${VERDACCIO_SERVER_URL} --access public`, @@ -129,7 +128,9 @@ async function initNewProjectFromSource( stdio: verbose ? 'inherit' : [process.stderr], }, ); - process.stdout.write(chalk.reset.inverse.bold.green(' DONE ') + '\n'); + process.stdout.write( + styleText(['reset', 'inverse', 'bold', 'green'], ' DONE ') + '\n', + ); } console.log('\nDone ✅'); diff --git a/scripts/release-testing/test-e2e-local.js b/scripts/release-testing/test-e2e-local.js index 89994d1cc08..48857d936fb 100644 --- a/scripts/release-testing/test-e2e-local.js +++ b/scripts/release-testing/test-e2e-local.js @@ -26,10 +26,10 @@ const { prepareArtifacts, setupGHAArtifacts, } = require('./utils/testing-utils'); -const chalk = require('chalk'); const fs = require('fs'); const path = require('path'); const {cd, exec, popd, pushd, pwd, sed} = require('shelljs'); +const {styleText} = require('util'); const yargs = require('yargs'); /* :: @@ -387,12 +387,15 @@ async function main() { await testRNTestProject(ghaArtifacts); console.warn( - chalk.yellow(` + styleText( + 'yellow', + ` ================================================================================ NOTE: Verdaccio may still be running on after this script has finished. Please Force Quit via Activity Monitor. ================================================================================ - `), + `, + ), ); } } diff --git a/scripts/release-testing/utils/github-actions-utils.js b/scripts/release-testing/utils/github-actions-utils.js index b1665d45d8f..1b6e4fb1842 100644 --- a/scripts/release-testing/utils/github-actions-utils.js +++ b/scripts/release-testing/utils/github-actions-utils.js @@ -11,9 +11,9 @@ 'use strict'; -const chalk = require('chalk'); const {execSync: exec} = require('child_process'); const fetch = require('node-fetch'); +const {styleText} = require('util'); /*:: type CIHeaders = { @@ -174,12 +174,15 @@ async function initialize( const started_by = workflow.triggering_actor.login; console.log( - chalk.green(`The artifact being used is from a workflow started ${chalk.bold.magentaBright(hours.toFixed(0))} hours ago by ${chalk.bold.magentaBright(started_by)}: + styleText( + 'green', + `The artifact being used is from a workflow started ${styleText(['bold', 'magentaBright'], hours.toFixed(0))} hours ago by ${styleText(['bold', 'magentaBright'], started_by)}: -Author: ${chalk.bold(commit.author.name)} +Author: ${styleText('bold', commit.author.name)} Message: -${chalk.magentaBright(quote(commit.message))} - `), +${styleText('magentaBright', quote(commit.message))} + `, + ), ); artifacts = await _getArtifacts(workflow.id); diff --git a/tools/api/package.json b/tools/api/package.json index 8f26475f3d3..e0e092d2338 100644 --- a/tools/api/package.json +++ b/tools/api/package.json @@ -12,7 +12,6 @@ "license": "MIT", "private": true, "dependencies": { - "chalk": "^4.0.0", "glob": "^7.1.1", "ini": "^5.0.0" } diff --git a/tools/api/public-api.js b/tools/api/public-api.js index b703efb6f3f..2c7758bb1cd 100644 --- a/tools/api/public-api.js +++ b/tools/api/public-api.js @@ -8,12 +8,12 @@ * @format */ -const chalk = require('chalk'); const {execSync} = require('child_process'); const fs = require('fs'); const glob = require('glob'); const ini = require('ini'); const path = require('path'); +const {styleText} = require('util'); const CONFIG_PATH = path.join(__dirname, './public-api.conf'); const GLOB_PROJECT_ROOT = path.resolve(path.join(__dirname, '../../')); @@ -82,8 +82,8 @@ function checkDependencies( ok = false; } const output = found - ? chalk.green(`✅ ${version}`) - : chalk.red('🚨 not found'); + ? styleText('green', `✅ ${version}`) + : styleText('red', '🚨 not found'); log.info(`🔍 ${command} → ${output}`); } return ok; @@ -306,7 +306,7 @@ function main() { ); } - log.info(chalk.bold('✅ Done!')); + log.info(styleText('bold', '✅ Done!')); } main();