studio - Bundle.config confundido sobre depuración y liberación y minificación

que es el bundle config

Question

Leí este artículo http://www.asp.net/mvc/tutorials/mvc-4/bundling-and-minification y creo que falta mucho contenido.

Estaba desarrollando un proyecto utilizando archivos javascript no minificados. Sin embargo, esto se convirtió en un problema cuando decidí publicar mi proyecto en otro servidor, donde bundle.config secuestra mis archivos javascript y hace cosas que nunca supe que necesitaba probar en mi desarrollo, y ahora mi máquina dev está lanzando todo tipo de errores de Javascript. Así que ahora, estoy aquí, leyendo sobre qué hace bundle.config con los archivos min.

Después de leer el artículo, hice las siguientes suposiciones:

Si configuro mi proyecto en modo de depuración, mi proyecto obtendrá todos los archivos javascript que no contengan ningún archivo "min.js".

si configuro mi proyecto en modo de lanzamiento, mi proyecto intentará obtener todos mis archivos min.js, y si no hay archivos min.js, los archivos que no sean min se convertirán a una versión reducida.

Basado en esas dos suposiciones, resulta que estaba equivocado . Cambiar al modo Release no hace nada con los archivos min, actúa de la misma manera que mi modo Debug.

En segundo lugar, entrar en web.config y establecer lo siguiente en falso (anteriormente verdadero):

<compilation debug="false" /> 

toma todos mis archivos que no son minificados y los minimiza, ¡ignorando los archivos mínimos que tengo! No veo nada sobre File.min.js, todo lo que veo es algo así como: "File? V = dw-fikdksdm ..." lo cual está bien, ya que esto se considera un "paquete" y se minimiza, pero ¿por qué? ¿No puedo simplemente ver mis minutos cargados? y ¿qué sucede si la minificación y el agrupamiento arroja errores de JavaScript? ¿Qué tendría que hacer en este momento? ¿Puedo evitar que algunos archivos javascript no se incluyan en un paquete y / o se minimicen?

También me he dado cuenta de que hay un par de errores 403 que ocurren cuando se intenta cargar los recursos de javascript.

¿Puede alguien explicar qué está pasando aquí y por qué esto va en contra de mi suposición original?

Answer 1

De acuerdo, aquí hay algunas cosas que descubrí sobre esto:

Cuando está en modo de depuración, y comprueba el web.config:

 <system.web>
     <compilation debug="true">

luego, todos sus javascripts se conservarán en el directorio virtual del paquete (no se fusionarán en un único archivo y no se minimizarán).

Cuando cambie al modo de liberación, cambie a:

 <system.web>
     <compilation debug="false">

para que todos sus archivos javascript dentro de un paquete sean minificados y compilados en un solo archivo, esto reduce los viajes redondos a la red. Tenga en cuenta que se crea un archivo para cada paquete.

Si desea obtener las optimizaciones habilitadas independientemente de si está o no en modo de depuración, configure BundleTable.EnableOptimizations = true, que fuerza la minificación y el agrupamiento. Si deja esto fuera del código, BundleConfig buscará en su lugar web.config.

RegisterBundles(BundleCollection bundles) method in BundleConfig.cs, you put in:

    BundleTable.EnableOptimizations = true;
    bundles.UseCdn = true;
    var cssTransformer = new CssTransformer();
    var jsTransformer = new JsTransformer();
    var nullOrderer = new NullOrderer();

y así es como lo agregarías en los archivos javascript:

    var jqueryBundle = new CustomScriptBundle("~/bundles/jquery");
    jqueryBundle.IncludeDirectory("~/Scripts/JQuery", "*.js");
    jqueryBundle.Transforms.Add(jsTransformer);
    jqueryBundle.Orderer = nullOrderer;
    bundles.Add(jqueryBundle);

Notas de pareja:

• Bundle.config ignora todos los archivos min. Agregué File.min.js y File.js, e ignora File.min.js, y minimiza File.js y lo agrupa con otros archivos incluidos en el paquete. Comprobé porque cuando minifiqué uno de los archivos, todos los nombres de variables (no el código estructurado) en comparación con los que se descargaron en mi sitio web eran completamente diferentes al archivo min que incluí en el proyecto. Por lo tanto, esto verifica que los archivos mínimos no son necesarios en su proyecto.
• Bundle.config ignora la minimización de los archivos con el nombre "File.debug.js", esto nunca se minimizará, de hecho, nunca se incluirá en su proyecto en la versión. Descubrí esto después de darme cuenta de que uno de mis archivos javascript nunca llegó al sitio.

• 403 errores ocurrirán si usa "Content / css" como su directorio virtual de donde aparecerá su paquete, esto necesita ser cambiado a "paquetes / css" y el 403 desaparecerá como tal (usando una afeitadora):

  @ Styles.Render ("~ / bundles / css")

lo que significa que si tienes esto en tu código (fíjate dónde ~ / bundle / css "es, aquí será donde irán tus archivos css):

BundleTable.EnableOptimizations = true;

bundles.UseCdn = true;
var cssTransformer = new CssTransformer();
var jsTransformer = new JsTransformer();
var nullOrderer = new NullOrderer();
#region CSS Styles
var cssBundle = new CustomStyleBundle("~/bundles/css");
cssBundle.IncludeDirectory("~/Content/CSS", "*.css")
         .IncludeDirectory("~/Content/CSS/Override", "*.css");
cssBundle.Transforms.Add(cssTransformer);
cssBundle.Orderer = nullOrderer;
bundles.Add(cssBundle);
#endregion

• Si su CSS tiene una ruta relativa, esto también puede cambiarse, así que busque errores 404
• No todos los archivos minificados se comportarán de la manera que usted quiera ... por lo que tendrá que hacer una versión semi incluida (o no tiene que minificar ninguna js en absoluto, y solo agruparlas)

Pero si quiere continuar haciendo el javascript minificado y no sabe qué archivos arrojan el error, los siguientes pasos le ayudarán:

1. Agrupe todo
2. Abra su navegador y encuentre todas las fuentes de sus paquetes js minificados
3. Copie el paquete de trabajo js en otro archivo
4. Comience manualmente insertando javascript usando las etiquetas en lugar de bundleconfig.cs, y continúe agregándolas una por una hasta que falle ... si eso falla ... entonces tendría que usar la versión no minimada de ese proyecto.
5. repita los pasos 3-4

Desearía que hubiera una mejor documentación de bundle.config en el momento de escribir este artículo, pero encontré que esta experiencia completa fue muy decepcionante.