¿Cómo sangrar / formatear automáticamente un file one-line-js?

un buen desarrollador anterior quería hacer nuestras vidas más difíciles antes de abandonar nuestra empresa y desarrolló un marco completo de UI de JavaScript en una sola línea. Quiero decir … probablemente él se equivocó después del desarrollo …

el punto es … hay muchos errores que debo solucionar … y me pregunto cómo se acercarían ustedes para sangrar automáticamente todo el código.

Gracias

un marco completo de UI javascript en una sola línea

El process de convertir código de desarrollo legible en código de producción galimatías se denomina minificación / uglificación . En una esencia, este process optimiza el código para el uso de producción. Dependiendo de la implementación, podría hacer (pero no limitarse a) lo siguiente:

  • comprime el código eliminando el espacio en blanco (que lo convierte en un trazador de líneas)
  • comprimir cambiando el nombre de las variables y funciones en unos más cortos
  • comprimir la syntax mediante el uso de syntax alternativa (como if s a ternaries, for a while )
  • eliminar el código muerto / inalcanzable

cómo ustedes se acercarían para sangrar automáticamente todo el código

Hay muchas herramientas para esta tarea:

  • Puede usar JSBeautifier , una herramienta en línea para formatear JS y HTML. Útil para un formatting rápido. Hay un complemento para eso si usa el editor Sublime Text.

  • Si usa Grunt, hay una tarea JSBeautifier creada para realizar la misma funcionalidad que la versión en línea de JSBeautifier.

  • Chrome tiene una bonita opción de printing en la pestaña Fuentes de las herramientas de desarrollo. Esto sangra el código comprimido en el depurador (no modifica el file).

  • Si el file tiene un map fuente adjunto (un file con el mismo nombre que el file del código, pero tiene una extensión *.map ), entonces estás de suerte. Un map de origen es como un dictionary que contiene un mapeo de los nombres en bruto con los nombres comprimidos. Los maps de origen son compatibles con las herramientas de desarrollo de Chrome y Firefox, pero no están habilitados de manera pnetworkingeterminada. Si lo habilita, el browser intentará downloadlos (suponiendo que estén contenidos junto con el file modificado) y los utilizará para verlos en la pestaña Fuente de las herramientas del desarrollador.