cleanup(react): migrate to picocolors

Migrates from `chalk` to `picocolors`.
nrwl · Sep 28, 2024 · ebf7750 · ebf7750
1 parent f221a41
commit ebf7750
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 7 deletions.
diff --git a/packages/react/.eslintrc.json b/packages/react/.eslintrc.json
@@ -4,7 +4,15 @@
   "overrides": [
     {
       "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
-      "rules": {}
+      "rules": {
+        "no-restricted-imports": [
+          "error",
+          {
+            "name": "chalk",
+            "message": "Please use `picocolors` in place of `chalk` for rendering terminal colors"
+          }
+        ]
+      }
     },
     {
       "files": ["**/*.ts"],

diff --git a/packages/react/package.json b/packages/react/package.json
@@ -34,9 +34,9 @@
   "dependencies": {
     "@phenomnomnominal/tsquery": "~5.0.1",
     "@svgr/webpack": "^8.0.1",
-    "chalk": "^4.1.0",
     "file-loader": "^6.2.0",
     "minimatch": "9.0.3",
+    "picocolors": "^1.1.0",
     "tslib": "^2.3.0",
     "@module-federation/enhanced": "~0.6.0",
     "@nx/devkit": "file:../devkit",

diff --git a/packages/react/src/generators/application/application.ts b/packages/react/src/generators/application/application.ts
@@ -33,7 +33,7 @@ import { maybeJs } from '../../utils/maybe-js';
 import { installCommonDependencies } from './lib/install-common-dependencies';
 import { extractTsConfigBase } from '../../utils/create-ts-config';
 import { addSwcDependencies } from '@nx/js/src/utils/swc/add-swc-dependencies';
-import * as chalk from 'chalk';
+import * as pc from 'picocolors';
 import { showPossibleWarnings } from './lib/show-possible-warnings';
 import { addE2e } from './lib/add-e2e';
 import {
@@ -319,9 +319,9 @@ export async function applicationGeneratorInternal(
 
   if (options.bundler === 'rspack' && options.style === 'styled-jsx') {
     logger.warn(
-      `${chalk.bold('styled-jsx')} is not supported by ${chalk.bold(
+      `${pc.bold('styled-jsx')} is not supported by ${pc.bold(
         'Rspack'
-      )}. We've added ${chalk.bold(
+      )}. We've added ${pc.bold(
         'babel-loader'
       )} to your project, but using babel will slow down your build.`
     );

diff --git a/packages/react/src/generators/application/lib/show-possible-warnings.ts b/packages/react/src/generators/application/lib/show-possible-warnings.ts
@@ -1,4 +1,4 @@
-import * as chalk from 'chalk';
+import * as pc from 'picocolors';
 import { logger, Tree } from '@nx/devkit';
 import { NormalizedSchema, Schema } from '../schema';
 
@@ -8,7 +8,7 @@ export function showPossibleWarnings(
 ) {
   if (options.style === 'styled-jsx' && options.compiler === 'swc') {
     logger.warn(
-      `styled-jsx may not work with SWC. Try using ${chalk.bold(
+      `styled-jsx may not work with SWC. Try using ${pc.bold(
         'nx g @nx/react:app --compiler=babel'
       )} instead.`
     );