Vue: Mejorar la información de los mensajes de advertencia

Este problema archivado requiere más información. ¿Estás usando vue 2 o vue 1.
¿Es un error o una sugerencia? si hay un error, entonces un enlace reproducible en jsfiddle.
Si alguno de sus componentes no tiene una función de controlador, esto no puede ser un problema de vue.

//Mejor

Estoy usando Vue 2. No es un error. Es un mensaje de error que no sirve de nada. Bueno, Vue puede tomar esto como una sugerencia para mejorar el estilo del mensaje de error y hacerlo específico. De modo que, por cualquier error, si algún desarrollador comete un error, puede solucionarlo en poco tiempo sabiendo exactamente dónde está el error. En comparación con React JS, muestran el nombre del componente junto con el número de línea y, por supuesto, también el error.

Todo lo que deseo es que el mensaje de error sea específico.

Hay muchos mensajes en Vue que realmente no dicen mucho. Desafortunadamente, parece que faltan controles de seguridad de Vue.

Supongo que si vue puede agregar un poco más de información a sus advertencias,

Nombre del componente
tipo de componente
o
puede hacer que el mensaje de advertencia sea configurable para el entorno de desarrollo.

Intentamos proporcionar información de los componentes siempre que podemos, este puede ser un descuido.

@ just-nadie, por favor, brinde ejemplos específicos de los mensajes que faltan para que podamos mejorar; solo quejarse no logra nada.

Realmente no me estaba quejando; Pensé que era algo que la gente ya sabía. Me encontré con muchos casos de borde pequeños en el pasado que dieron un mensaje extraño y anodino del problema real, pero en cambio se arraigaron profundamente en la fuente, y algunos otros problemas no emitieron un error, y en su lugar causaron una representación extraña bicho. Algunos eran más fáciles de rastrear que otros, así que no me molesté en denunciarlos, ya que pensé que solo era yo siendo estúpido, pero en uno en particular creé una solicitud de extracción porque me tomó mucho tiempo descubrir qué estaba mal. .

Me imagino que muchos de ellos están arreglados ahora que 2.0.1 está fuera, pero mi mal por permanecer en silencio, supongo. Un mensaje para los lectores: si cree que es un error, infórmelo, incluso si puede terminar no siendo un error.

@ yyx990803 Incluso, proporcionar la clave de nombre de un componente no ayuda mucho. Gracias por visitarnos y agregar este problema como una mejora.

:) gracias Evan

Hola, he notado recientemente que la falta de números de línea hace que las cosas sean realmente difíciles de depurar, especialmente si el componente es grande. Tengo un componente con un par de miles de líneas. Recibí una advertencia
"[Vue warn]: Error en la función de renderizado:" TypeError: _vm.values ​​[item.name] is undefined ""

Hay un nombre de componente, pero no un número de línea en mi consola Firefox. Para este tipo de casos, sería muy útil tener un número de línea específico. Por supuesto, puedo dividir el componente en varios más pequeños o simplemente explorar todas estas líneas con la búsqueda del editor, pero ese no es el punto.

Considere agregar números de línea en las próximas versiones. Gracias.

+1 Agregue números de línea.

Recibí el siguiente mensaje,

vue.js: 577 [Vue warn]: Error en el renderizado: "TypeError: No se puede leer la propiedad 'longitud' de indefinido"
(encontrado en)

Sé por qué falla, en esta construcción "variable.length" si variable == null. El problema es que tengo muchas construcciones ".length", los datos provienen de un servicio externo.

Lo mismo para mí @ ameoba32
Tengo "No se puede leer la propiedad 'longitud' de indefinida" y no encuentro dónde está el problema. Es una gran aplicación web, por lo que es difícil.
Supongo que encontré el archivo en la causa pero no sé dónde está exactamente el error.
¿Debo errazar línea por línea para encontrar la línea rota? xD

Lo mismo aquí como @ ameoba32 . @ yyx990803 Por favor, haz algo. ¡Gracias!

Amo vue, mucho y he estado trabajando con él durante dos años. La falta de especificidad en un error de RENDER es mi queja / solicitud número 1 para corregirlo. Este error ocurre en la plantilla o en el código js correspondiente. Un número de línea sería de gran ayuda, o incluso si el problema se encuentra en la plantilla o en el código js.

tenía el mismo problema

Si. Tengo el mismo problema ;)

unreachable code after return statement[Więcej informacji] app.js:5248:4
unreachable code after return statement[Więcej informacji] app.js line 4957 > eval:5248:4
unreachable code after return statement[Więcej informacji] app.js:5248:4
unreachable code after return statement[Więcej informacji] app.js line 5136 > eval:5248:4

Entiendo lo que significa, pero no sé dónde debería solucionarlo y revisar todos mis componentes para encontrar esos problemas es un montón de trabajo.

Aquí igual.

vue.common.js no significa nada para mí cuando trato de encontrar dónde ocurrió el error.

Estoy de acuerdo, que solo el número de línea en el archivo de origen acelerará mucho la depuración

algo nuevo sobre esto? ¿Por qué está cerrado el problema (ya que el problema sigue ahí)?

¡Me encantaría que esto se arreglara! la depuración es demasiado complicada en este momento, necesitamos el nombre del archivo y el número de línea para facilitar la depuración, por favor corríjalo

También estoy de acuerdo, mis archivos .vue son tan grandes y ayudaría obtener la ubicación exacta.

He avanzado un poco en la determinación de qué componente y puedo obtener el número de línea (en muchos casos) del error. (Estoy usando componentes de un solo archivo). Pero aún queda mucha investigación por hacer. Espero dar a conocer mis hallazgos en el futuro.

@ gpadilla123 Dios, señor. Esperando su trabajo.

En caso de que alguna persona todavía esté combinando su código en busca de declaraciones de retorno mal formadas, encontré la fuente del error que ocurre cuando uso tanto una expresión como una llamada a función en la plantilla:
:class="x=0; getClass()" en este caso, eliminar x=0; eliminó la advertencia. No es que este sea necesariamente el caso de nadie en esta lista, pero es un recordatorio para verificar la plantilla.

Incluso hasta el día de hoy, todavía no está tan claro como las bolas. Recibo un error cuando vue está evaluando algo que ni siquiera estoy cambiando ...

Vue 3.0 debería resolver este problema, ya que tendrá mejores mensajes de error, pero la fecha de lanzamiento de Vue 3.0 va desde el final del segundo trimestre de 2019 hasta el final de 2019. Demasiado tiempo para esperar, así que he pirateado una forma de obtener la línea. números de los errores (para algunos casos). La solución pirateada debe ser más sólida y funcionar para más casos.

sí, esto me está matando, esperaba al menos el número de línea o algo para especificar mejor

+1

Esto es mortal. Necesitamos que las líneas en las que se producen los errores se informen correctamente. Por el momento, parece que obtengo números de línea vue.js completamente inútiles cuando ocurre un error, por ejemplo.

[Vue warn]: Error en el renderizado: "TypeError: No se puede leer la propiedad '0' de undefined"

[Vue warn]: Error in render: "TypeError: Cannot read property 'length' of undefined"
Será divertido buscar la línea. Especialmente cuando hay muchos .length en mi código.

Mensajes como estos son como una búsqueda inútil. No tengo idea de dónde se originó el error: esperaría un número de línea, el nombre de un vue, el nombre de una función que hice y que no es parte del marco de Vue. Esto sucede en vue 2.5.17. Tampoco hay ayuda de la extensión de desarrollo vue en casos como estos.

Me alegra saber que esto se abordará en Vue 3.0. Mientras tanto, encontré un buen consejo: haga clic en el indicador de línea de error en la consola, luego coloque un punto de interrupción en la misma línea en la fuente de Vue. A continuación, puede volver a cargar la página, el depurador se detendrá en el punto de interrupción, luego podrá volver a trabajar en la pila hasta que encuentre uno de sus componentes y, por lo general, el error está ahí.

No es perfecto, pero podría ayudarte a despegarte en una búsqueda de errores.

[Vue warn]: Error in render: "TypeError: Cannot read property 'length' of undefined"
Será divertido buscar la línea. Especialmente cuando hay muchos .length en mi código.

Finalmente encontré la línea.
No habría tardado tanto si el problema se hubiera resuelto.

+1, el registro de la consola de vue es muy deficiente. Tome el siguiente, por ejemplo. Me dice la pila de componentes, lo cual es bueno, pero no hay ninguna referencia al número de línea aquí, y toda la pila de llamadas apunta a compilar el código vue, no el código de mi componente. Un número de línea junto al nombre del componente es todo lo que necesita.

También tengo problemas para depurar sin números de línea ...

Desafío aceptado.

Esto ha sido un fastidio durante años y todavía lo es.

Estaba desplazándome por esto con la esperanza de que alguien ya tuviera algún truco súper secreto para esto o alguna actualización ya

+1

TypeError: Cannot read property 'length' of undefined

pero tengo 30-50

Realmente necesitamos el número de línea en los errores de renderizado.

¿Alguna solución?

Puedo confirmar, estoy aquí mirando mi código ... sin idea de por qué está fallando.

Si Vue tiene desventajas, esta sería la única.