Replace chalk.reset with stripAnsi in @vue/cli-shared-utils/lib/logge…

…r.js (vuejs#4842) * Replace chalk.reset with stripAnsi When logging multi-line logs, the logger uses chalk.reset in order to get the length of the tag for the log. This is to achieve an indented layout of multi-line logs. chalk.reset only replaces styles such as bold and italic, not color. When the tag contains colors, the result is not pretty. Replacing with stripAnsi gets the intended result. * Adds reference to strip-ansi * Removes misplaces comma from package.json * Removes extraneous semicolon
jacekkarczmarczyk · Nov 27, 2019 · 13376ce · 13376ce
1 parent ba9596d
commit 13376ce
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 2 deletions.
diff --git a/packages/@vue/cli-shared-utils/lib/logger.js b/packages/@vue/cli-shared-utils/lib/logger.js
@@ -1,4 +1,5 @@
 const chalk = require('chalk')
+const stripAnsi = require('strip-ansi')
 const readline = require('readline')
 const padStart = require('string.prototype.padstart')
 const EventEmitter = require('events')
@@ -19,7 +20,7 @@ const format = (label, msg) => {
   return msg.split('\n').map((line, i) => {
     return i === 0
       ? `${label} ${line}`
-      : padStart(line, chalk.reset(label).length)
+      : padStart(line, stripAnsi(label).length)
   }).join('\n')
 }
 

diff --git a/packages/@vue/cli-shared-utils/package.json b/packages/@vue/cli-shared-utils/package.json
@@ -31,7 +31,8 @@
     "request": "^2.87.0",
     "request-promise-native": "^1.0.8",
     "semver": "^6.1.0",
-    "string.prototype.padstart": "^3.0.0"
+    "string.prototype.padstart": "^3.0.0",
+    "strip-ansi" : "^6.0.0"
   },
   "publishConfig": {
     "access": "public"