style: 🎨 beautify the help page display (#9)

package.json

@@ -49,7 +49,6 @@
   "dependencies": {
     "@clack/prompts": "^0.7.0",
     "axios": "^1.7.2",
-    "chalk": "^5.3.0",
     "cli-table3": "^0.6.5",
     "commander": "^12.1.0",
     "fs-extra": "^11.2.0",

src/index.ts

@@ -5,6 +5,7 @@ import Table from 'cli-table3';
 
 import packageJson from '../package.json' assert { type: 'json' };
 
+import { colorize } from './utils';
 import { setConfig, getConfig, initializeProject } from './core/config';
 import { ConfigItem } from './types';
 import createComponents from './core/components';
@@ -16,13 +17,23 @@ async function main() {
   try {
     await initializeProject();
   } catch (error) {
-    console.error('Error ensuring config file exists:', error);
+    console.error(colorize('Error ensuring config file exists:', 'red'), error);
     process.exit(1); // 如果无法确保配置文件存在，则退出进程
   }
 
   const program = new Command();
 
-  program.version(packageJson.version).description('Moment!!!');
+  program
+    .version(packageJson.version)
+    .description(
+      colorize(
+        `南有嘉鱼，烝然罩罩。君子有酒，嘉宾式燕以乐。\n` +
+          `南有嘉鱼，烝然汕汕。君子有酒，嘉宾式燕以衎。\n` +
+          `南有樛木，甘瓠累之。君子有酒，嘉宾式燕绥之。\n` +
+          `南有樛木，甘瓠蕡蕡。君子有酒，嘉宾式燕以仁。`,
+        'green',
+      ),
+    );
 
   program
     .command('commit')
@@ -48,9 +59,9 @@ async function main() {
     .action(async (key, value) => {
       try {
         await setConfig(key as keyof ConfigItem, value);
-        console.log(`Config set: ${key} = ${value}`);
+        console.log(colorize(`Config set: ${key} = ${value}`, 'green'));
       } catch (error) {
-        console.error(`Error setting config: ${error}`);
+        console.error(colorize(`Error setting config: ${error}`, 'red'));
       }
     });
 
@@ -60,9 +71,9 @@ async function main() {
     .action(async (key) => {
       try {
         const value = await getConfig(key as keyof ConfigItem);
-        console.log(`${key} = ${value}`);
+        console.log(colorize(`${key} = ${value}`, 'cyan'));
       } catch (error) {
-        console.error(`Error getting config: ${error}`);
+        console.error(colorize(`Error getting config: ${error}`, 'red'));
       }
     });
 
@@ -77,15 +88,15 @@ async function main() {
     .command('hooks <name>')
     .description('Add a new Hooks')
     .action(async (name) => {
-      console.log(name);
+      console.log(colorize(name, 'yellow'));
       generatorHooks(name);
     });
 
   // 自定义帮助信息
   program.addHelpText('after', () => {
     // 创建表格
     const table = new Table({
-      head: ['Command', 'Description'],
+      head: [colorize('Command', 'green'), colorize('Description', 'green')],
       colWidths: [30, 70],
       style: {
         head: ['cyan'],
@@ -96,28 +107,28 @@ async function main() {
     // 填充表格内容
     table.push(
       [
-        'commit',
-        'Generate a commit message\nAI will automatically generate submission information for you.\n\nExample:\n  $ ai commit',
+        colorize('commit', 'cyan'),
+        `Generate a commit message\nAI will automatically generate submission information for you.\n\nExample:\n  ${colorize('$ ai commit', 'blue')}`,
       ],
       [
-        'review',
+        colorize('review', 'cyan'),
         'Generate a code review\nAI will automatically generate code review information for you.\n\nExample:\n  $ ai review',
       ],
       [
-        'set <key> <value>',
-        'Set a global configuration key and value.\n\nParameters:\n  key: The configuration key\n  value: The value to set\n\nExample:\n  $ ai set username john_doe',
+        colorize('set <key> <value>', 'cyan'),
+        `Set a global configuration key and value.\n\nParameters:\n  key: The configuration key\n  value: The value to set\n\nExample:\n  ${colorize('$ ai set username john_doe', 'blue')}`,
       ],
       [
-        'get <key>',
-        'Get a global configuration value.\n\nParameters:\n  key: The configuration key to retrieve\n\nExample:\n  $ ai get username',
+        colorize('get <key>', 'cyan'),
+        `Get a global configuration value.\n\nParameters:\n  key: The configuration key to retrieve\n\nExample:\n  ${colorize('$ ai get username', 'blue')}`,
       ],
       [
-        'component <name> [path]',
-        'Add a new component.\n\nParameters:\n  name: The name of the component\n  path: (Optional) The path to add the component\n\nExample:\n  $ ai component Button src/components',
+        colorize('component <name> [path]', 'cyan'),
+        `Add a new component.\n\nParameters:\n  name: The name of the component\n  path: (Optional) The path to add the component\n\nExample:\n  ${colorize('$ ai component Button src/components', 'blue')}`,
       ],
       [
-        'hooks <name>',
-        'Add a new Hooks.\n\nParameters:\n  name: The name of the hooks\n\nExample:\n  $ ai hooks useCustomHook',
+        colorize('hooks <name>', 'cyan'),
+        `Add a new Hooks.\n\nParameters:\n  name: The name of the hooks\n\nExample:\n  ${colorize('$ ai hooks useCustomHook', 'blue')}`,
       ],
     );
 

src/utils/color.ts

@@ -0,0 +1,57 @@
+interface Colors {
+  reset: string;
+  bright: string;
+  dim: string;
+  underscore: string;
+  blink: string;
+  reverse: string;
+  hidden: string;
+  black: string;
+  red: string;
+  green: string;
+  yellow: string;
+  blue: string;
+  magenta: string;
+  cyan: string;
+  white: string;
+  bgBlack: string;
+  bgRed: string;
+  bgGreen: string;
+  bgYellow: string;
+  bgBlue: string;
+  bgMagenta: string;
+  bgCyan: string;
+  bgWhite: string;
+}
+
+const colors: Colors = {
+  reset: '\x1b[0m',
+  bright: '\x1b[1m',
+  dim: '\x1b[2m',
+  underscore: '\x1b[4m',
+  blink: '\x1b[5m',
+  reverse: '\x1b[7m',
+  hidden: '\x1b[8m',
+  black: '\x1b[30m',
+  red: '\x1b[31m',
+  green: '\x1b[32m',
+  yellow: '\x1b[33m',
+  blue: '\x1b[34m',
+  magenta: '\x1b[35m',
+  cyan: '\x1b[36m',
+  white: '\x1b[37m',
+  bgBlack: '\x1b[40m',
+  bgRed: '\x1b[41m',
+  bgGreen: '\x1b[42m',
+  bgYellow: '\x1b[43m',
+  bgBlue: '\x1b[44m',
+  bgMagenta: '\x1b[45m',
+  bgCyan: '\x1b[46m',
+  bgWhite: '\x1b[47m',
+};
+
+type ColorName = keyof Colors;
+
+export function colorize(text: string, color: ColorName): string {
+  return colors[color] + text + colors.reset;
+}

src/utils/index.ts

@@ -1,7 +1,9 @@
 import * as path from 'path';
+import { promises as fs } from 'fs';
 import * as os from 'os';
+
 export * from './openai';
-import { promises as fs } from 'fs';
+export * from './color';
 
 /**
  * 获取操作系统的根目录。