depuración de plantillas underscore.js es difícil sin números de línea

Question

Estoy convirtiendo una plantilla de php bastante grande (página con lógica básica) en una plantilla underscore.js.

El problema es que sigo teniendo errores en él, y su versión "compilada" minimizada no da información útil o números de línea cuando se produce un error.

¿Hay alguna manera de obtener una mejor depuración de plantilla en underscore.js (como los números de línea)? Y si no es así, ¿hay alguna manera de que la plantilla termine en un punto (de esta forma puedo reducir el error).

Answer 1

erratas como de Abr 2012:subrayado 1.3.2 (9 de abril de 2012) han introducido cambios a _.template(), active la changelog y la fuente ya que las complicaciones a lo que se ha descrito aquí podría haber aparecido.

Sí y no: la plantilla se traduce primero a una cadena de código JavaScript (difícil de leer) y se ejecuta como un bloque de código, por lo que si está buscando un error de sintaxis debe eliminar el código ofensivo de la plantilla que intentas ejecutar

Pero si que es otra cosa, la incorporación de un <% return __p.join(''); %> romperá ejecución y devolver el resultado de la plantilla hasta ese momento (leer la fuente para ver por qué, pero en esencia, los resultados de los bloques de la plantilla se ponen en una matriz llamada __p Uno después del otro).

También se puede hacer el registro, mientras que sus evalúa plantilla (es decir, ponen <% console.log(<..>) %> en su plantilla para ver el diagnóstico. Para solucionar problemas más avanzados, también se puede poner un <% debugger; %> en su código de plantilla para caer en el depurador favorito. A pesar de que el código que Verá será hostil leer tendrá acceso al alcance de las plantillas de evaluación.

Si estuviera haciendo un trabajo extenso y necesitara instalaciones de depuración más extensas, probablemente tomaría una copia del script underscore.js y agregaría algún diagnóstico código de soporte para la función _.template(). Por ejemplo:

_.template = function(str, data) { 
    var c = _.templateSettings; 
    var tmpl = 'var __p=[],print=function(){__p.push.apply(__p,arguments);};' + 
    'with(obj||{}){__p.push(\'' + 
    str.replace(/\\/g, '\\\\') 
     .replace(/'/g, "\\'") 
     .replace(c.interpolate, function(match, code) { 
     return "'," + code.replace(/\\'/g, "'") + ",'"; 
     }) 
     .replace(c.evaluate || null, function(match, code) { 
     return "');" + code.replace(/\\'/g, "'") 
          .replace(/[\r\n\t]/g, ' ') + "__p.push('"; 
     }) 
     .replace(/\r/g, '\\r') 
     .replace(/\n/g, '\\n') 
     .replace(/\t/g, '\\t') 
     + "');}return __p.join('');"; 
    console.log(tmpl.replace(/;/g, '\n')); // <- dump compiled code to console before evaluating 
    var func = new Function('obj', tmpl); 
    return data ? func(data) : func; 
}; 

Answer 2

En Backbone Eye (extensión Firebug), puede depurar plantillas de subrayado, como si fueran archivos regulares de JavaScript. La identificación de la plantilla (si se especifica) aparece en la ventana del script (de Firefox) y puede seleccionarla (al igual que un archivo de script normal), colocar puntos de interrupción y ver cómo se construye la plantilla de forma incremental. Más detalles sobre cómo hacer esto está en http://dhruvaray.github.io/spa-eye/#views. Esto debería ayudarlo a reducir el origen de su error fácilmente.

[Descargo de responsabilidad: yo soy el autor de los ojos Backbone]

Answer 3

Si usted tiene un error de sintaxis JavaScript dentro de un molde largo a veces puede ser difícil de encontrar, ya que la linter no va a entender javascript dentro < %%>

Use su editor de reemplazar la función y reemplazar:

Encontrar:

%>[\s\S]*?<%[=-]? 

reemplazar:

\n//html\n 

Se eliminará todo el código HTML entre su Javascript a continuación se puede utilizar una desfibradora o http://esprima.org/demo/validate.html para encontrar los errores de sintaxis.

Después de reemplazar a todos y embellecido:

Nota: Esta expresión regular dejará HTML que queda en el inicio y el final de su archivo, por lo que basta con retirar los manualmente.