feat(cli): add stepper to improve logging

packages/vant-cli/src/commands/build.ts

@@ -9,8 +9,8 @@ import { genPackageEntry } from '../compiler/gen-package-entry';
 import { genStyleDepsMap } from '../compiler/gen-style-deps-map';
 import { genComponentStyle } from '../compiler/gen-component-style';
 import { SRC_DIR, LIB_DIR, ES_DIR } from '../common/constant';
+import { getStepper } from '../common/logger';
 import {
-  logger,
   isDir,
   isSfc,
   isStyle,
@@ -21,6 +21,8 @@ import {
   setModuleEnv
 } from '../common';
 
+const stepper = getStepper(8);
+
 async function compileDir(dir: string) {
   const files = readdirSync(dir);
 
@@ -56,53 +58,53 @@ async function compileDir(dir: string) {
 async function buildESModuleOutputs() {
   await copy(SRC_DIR, ES_DIR);
 
-  logger.start('Build esmodule outputs');
+  stepper.start('Build ESModule Outputs');
 
   try {
     setModuleEnv('esmodule');
     await compileDir(ES_DIR);
-    logger.success('Build esmodule outputs');
+    stepper.success('Build ESModule Outputs');
   } catch (err) {
-    logger.error('Build esmodule outputs');
+    stepper.error('Build ESModule Outputs', err);
   }
 }
 
 async function buildCommonjsOutputs() {
   await copy(SRC_DIR, LIB_DIR);
 
-  logger.start('Build commonjs outputs');
+  stepper.start('Build Commonjs Outputs');
 
   try {
     setModuleEnv('commonjs');
     await compileDir(LIB_DIR);
-    logger.success('Build commonjs outputs');
+    stepper.success('Build Commonjs Outputs');
   } catch (err) {
-    logger.error('Build commonjs outputs');
+    stepper.error('Build Commonjs Outputs', err);
   }
 }
 
 async function buildStyleEntry() {
-  logger.start('Build style entry');
+  await genStyleDepsMap();
 
+  stepper.start('Build Style Entry');
   try {
-    await genStyleDepsMap();
     genComponentStyle();
-    logger.success('Build style entry');
+    stepper.success('Build Style Entry');
   } catch (err) {
-    logger.error('Build style entry');
+    stepper.error('Build Style Entry', err);
   }
 }
 
 async function buildPackedOutputs() {
-  logger.start('Build packed outputs');
+  stepper.start('Build Packed Outputs');
 
   try {
     genPackageEntry();
     await compilePackage(false);
     await compilePackage(true);
-    logger.success('Build packed outputs');
+    stepper.success('Build Packed Outputs');
   } catch (err) {
-    logger.error('Build packed outputs');
+    stepper.error('Build Packed Outputs', err);
   }
 }
 

packages/vant-cli/src/commands/commit-lint.ts

@@ -1,5 +1,5 @@
-import { logger } from '../common';
 import { readFileSync } from 'fs-extra';
+import { logger } from '../common/logger';
 
 const commitRE = /^(revert: )?(fix|feat|docs|perf|test|types|build|chore|refactor|breaking change)(\(.+\))?: .{1,50}/;
 const mergeRE = /Merge branch /;

packages/vant-cli/src/commands/lint.ts

@@ -1,10 +1,12 @@
 import { lint as stylelint } from 'stylelint';
 import { CLIEngine } from 'eslint';
-import { logger } from '../common';
+import { getStepper } from '../common/logger';
 import { SCRIPT_EXTS } from '../common/constant';
 
+const stepper = getStepper(4);
+
 function lintScript() {
-  logger.start('ESLint Start');
+  stepper.start('ESLint Start');
 
   const cli = new CLIEngine({
     fix: true,
@@ -19,15 +21,14 @@ function lintScript() {
   // output lint errors
   const formatted = formatter(report.results);
   if (formatted) {
-    logger.error('ESLint Failed');
-    console.log(formatter(report.results));
+    stepper.error('ESLint Failed', '\n' + formatter(report.results));
   } else {
-    logger.success('ESLint Passed');
+    stepper.success('ESLint Passed');
   }
 }
 
 function lintStyle() {
-  logger.start('Stylelint Start');
+  stepper.start('Stylelint Start');
 
   stylelint({
     fix: true,
@@ -35,10 +36,9 @@ function lintStyle() {
     files: ['src/**/*.css', 'src/**/*.less', 'src/**/*.scss', 'src/**/*.vue']
   }).then(result => {
     if (result.errored) {
-      logger.error('Stylelint Failed');
-      console.log(result.output);
+      stepper.error('Stylelint Failed', '\n' + result.output);
     } else {
-      logger.success('Stylelint Passed');
+      stepper.success('Stylelint Passed');
     }
   });
 }