improve warning component tracing (close vuejs#5389)

yyx990803 · yyx990803 · commit 4dff99d6e3b8 · 2017-04-10T14:41:08.000+08:00
diff --git a/src/core/util/debug.js b/src/core/util/debug.js
@@ -14,16 +14,16 @@ if (process.env.NODE_ENV !== 'production') {
 
   warn = (msg, vm) => {
     if (hasConsole && (!config.silent)) {
-      console.error(`[Vue warn]: ${msg} ` + (
-        vm ? formatLocation(formatComponentName(vm)) : ''
+      console.error(`[Vue warn]: ${msg}` + (
+        vm ? generateComponentTrace(vm) : ''
       ))
     }
   }
 
   tip = (msg, vm) => {
     if (hasConsole && (!config.silent)) {
-      console.warn(`[Vue tip]: ${msg} ` + (
-        vm ? formatLocation(formatComponentName(vm)) : ''
+      console.warn(`[Vue tip]: ${msg}` + (
+        vm ? generateComponentTrace(vm) : ''
       ))
     }
   }
@@ -52,11 +52,23 @@ if (process.env.NODE_ENV !== 'production') {
     )
   }
 
-  const formatLocation = str => {
-    if (str === `<Anonymous>`) {
-      str += ` - use the "name" option for better debugging messages.`
+  const generateComponentTrace = vm => {
+    if (vm._isVue && vm.$parent && String.prototype.repeat) {
+      const tree = []
+      while (vm) {
+        tree.push(vm)
+        vm = vm.$parent
+      }
+      return '\n\nfound in\n\n' + tree
+        .map((vm, i) => `${
+          i === 0 ? '---> ' : ' '.repeat(5 + i * 2)
+        }${
+          formatComponentName(vm)
+        }`)
+        .join('\n')
+    } else {
+      return `\n\n(found in ${formatComponentName(vm)})`
     }
-    return `\n(found in ${str})`
   }
 }
 
diff --git a/src/core/util/error.js b/src/core/util/error.js
@@ -7,7 +7,7 @@ export function handleError (err, vm, info) {
     config.errorHandler.call(null, err, vm, info)
   } else {
     if (process.env.NODE_ENV !== 'production') {
-      warn(`Error in ${info}:`, vm)
+      warn(`Error in ${info}: "${err.toString()}"`, vm)
     }
     /* istanbul ignore else */
     if (inBrowser && typeof console !== 'undefined') {

Original file line number	Diff line number	Diff line change
`@@ -14,16 +14,16 @@ if (process.env.NODE_ENV !== 'production') {`
`14`	`14`
`15`	`15`	`warn = (msg, vm) => {`
`16`	`16`	`if (hasConsole && (!config.silent)) {`
`17`		- console.error(`[Vue warn]: ${msg} ` + (
`18`		`- vm ? formatLocation(formatComponentName(vm)) : ''`
	`17`	+ console.error(`[Vue warn]: ${msg}` + (
	`18`	`+ vm ? generateComponentTrace(vm) : ''`
`19`	`19`	`))`
`20`	`20`	`}`
`21`	`21`	`}`
`22`	`22`
`23`	`23`	`tip = (msg, vm) => {`
`24`	`24`	`if (hasConsole && (!config.silent)) {`
`25`		- console.warn(`[Vue tip]: ${msg} ` + (
`26`		`- vm ? formatLocation(formatComponentName(vm)) : ''`
	`25`	+ console.warn(`[Vue tip]: ${msg}` + (
	`26`	`+ vm ? generateComponentTrace(vm) : ''`
`27`	`27`	`))`
`28`	`28`	`}`
`29`	`29`	`}`
`@@ -52,11 +52,23 @@ if (process.env.NODE_ENV !== 'production') {`
`52`	`52`	`)`
`53`	`53`	`}`
`54`	`54`
`55`		`- const formatLocation = str => {`
`56`		- if (str === `<Anonymous>`) {
`57`		- str += ` - use the "name" option for better debugging messages.`
	`55`	`+ const generateComponentTrace = vm => {`
	`56`	`+ if (vm._isVue && vm.$parent && String.prototype.repeat) {`
	`57`	`+ const tree = []`
	`58`	`+ while (vm) {`
	`59`	`+ tree.push(vm)`
	`60`	`+ vm = vm.$parent`
	`61`	`+ }`
	`62`	`+ return '\n\nfound in\n\n' + tree`
	`63`	+ .map((vm, i) => `${
	`64`	`+ i === 0 ? '---> ' : ' '.repeat(5 + i * 2)`
	`65`	`+ }${`
	`66`	`+ formatComponentName(vm)`
	`67`	+ }`)
	`68`	`+ .join('\n')`
	`69`	`+ } else {`
	`70`	+ return `\n\n(found in ${formatComponentName(vm)})`
`58`	`71`	`}`
`59`		- return `\n(found in ${str})`
`60`	`72`	`}`
`61`	`73`	`}`
`62`	`74`
Original file line number	Diff line number	Diff line change
`@@ -7,7 +7,7 @@ export function handleError (err, vm, info) {`
`7`	`7`	`config.errorHandler.call(null, err, vm, info)`
`8`	`8`	`} else {`
`9`	`9`	`if (process.env.NODE_ENV !== 'production') {`
`10`		- warn(`Error in ${info}:`, vm)
	`10`	+ warn(`Error in ${info}: "${err.toString()}"`, vm)
`11`	`11`	`}`
`12`	`12`	`/* istanbul ignore else */`
`13`	`13`	`if (inBrowser && typeof console !== 'undefined') {`