c# - scripts - style bundle in mvc

ASP.NET MVC 4 El empaquetado de secuencias de comandos provoca errores en la implementación

Question

Mi sitio web funciona bien en localhost cuando @Scripts.Render() no está empaquetando los scripts; sin embargo, cuando implemento en mi servidor, el Javascript incluido debe contener un error, ya que todo Javascript en mi página deja de funcionar.

Aquí está mi código de paquete:

        public static void RegisterBundles(BundleCollection bundles)
        {
            bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                        "~/Scripts/jquery-{version}.js",
                    "~/Scripts/jquery-migrate-{version}.js"));

            bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                    "~/Scripts/jquery.unobtrusive*",
                    "~/Scripts/jquery.validate*"));

            bundles.Add(new ScriptBundle("~/bundles/jqueryui").Include(
                        "~/Scripts/jquery-ui-{version}.js",
                        "~/Scripts/jquery-ui.unobtrusive-{version}.js"));

            bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
                        "~/Scripts/modernizr-*"));

            bundles.Add(new StyleBundle("~/Content/css").Include("~/Content/site.css"));

            bundles.Add(new StyleBundle("~/Content/themes/base/css").Include(
                        "~/Content/themes/base/jquery.ui.core.css",
                        "~/Content/themes/base/jquery.ui.resizable.css",
                        "~/Content/themes/base/jquery.ui.selectable.css",
                        "~/Content/themes/base/jquery.ui.accordion.css",
                        "~/Content/themes/base/jquery.ui.autocomplete.css",
                        "~/Content/themes/base/jquery.ui.button.css",
                        "~/Content/themes/base/jquery.ui.dialog.css",
                        "~/Content/themes/base/jquery.ui.slider.css",
                        "~/Content/themes/base/jquery.ui.tabs.css",
                        "~/Content/themes/base/jquery.ui.datepicker.css",
                        "~/Content/themes/base/jquery.ui.progressbar.css",
                        "~/Content/themes/base/jquery.ui.theme.css"));
        }

Aquí está mi código de representación:

@Styles.Render("~/Content/css")
@Styles.Render("~/Content/themes/base/css")
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/jqueryval")
@Scripts.Render("~/bundles/jqueryui")
@Scripts.Render("~/bundles/modernizr")

¿Alguien puede explicar lo que podría estar sucediendo con mi Javascript en la implementación?

Gracias, Alex.

Answer 1

La minificación "funciona" incluso si aparecen errores

La verdadera solución para esto es:

• Excluya los archivos .min y .map ANTES de publicar

Y la minificación funcionará. De hecho, el proceso de minificación siempre funciona!

Si "funciona", ¿qué está pasando realmente? ¿Por qué tenemos un error?

ASP.Net parece utilizar los archivos .min en prioridad cuando se agrupan con optimizaciones habilitadas. Por lo tanto, también integrará cualquier código en los archivos .min y agregará todos los archivos javascript uno tras otro sin agregar saltos de línea.

Es el navegador el que no puede entender por qué hay un comentario potencial / * Después de la configuración de mapeo mínima: // # sourceMappingURL = jquery.history.min.js.map Debido a que los archivos agrupados se verán así:

[SOMEJAVASCRIPT OF FILEJAVASCRIPT1 HERE;]
//# sourceMappingURL=jquery.history.min.js.map /* begin of a comment of FILEJAVASCRIPT2 appended (in the bundle) javascript file */

Hay dos soluciones para evitar ese error:

• Cree paquetes separados para los archivos javascript que no pueden seguir (es como no activar la función de paquete).
• Crea un paquete que no habilite la minificación (mal)
• O una alternativa: excluir todos los archivos minificados o los archivos min.js que tienen un sourceMappingURL (o cambiar su origen) y archivos .map

El objetivo sería forzar a ASP.Net a que regenere los archivos min por sí mismo (y ASP.Net no realizará // sourceMappingUrl dentro de su archivo generado, por lo que solucionará ese problema).

Entonces, el problema real es la implementación actual de esta característica dentro de los navegadores porque parece que no puede analizar los comentarios para el comentario de sourcemapping. Quizás haya otra manera de indicar al navegador que ha finalizado sourceMappingUrl.

Answer 2

Por lo general, la única diferencia entre la depuración y los paquetes implementados es que las optimizaciones se desactivan cuando se está depurando.

Cuando se activan las optimizaciones, es posible que la minificación resalte un error de sintaxis que se perdonaría si hubiera un salto de línea. Por ejemplo:

var x = 10
var y = 15

No minimizado, esto probablemente funcionaría, pero al final terminaste con ...

var x = 10 var y = 15 // SyntaxError: missing ; before statement

Lo que no funcionará, necesitas lo que falta ; personajes de allí

Si depura el script, debería poder ver dónde está el error.

Answer 3

Revisa esta solución
Configuración de IIS> Autenticación> Autenticación anónima de RightClickOn> Haga clic en Editar> Comprobar identidad de grupo de aplicaciones

Tomado de here .

Answer 4

También puede cambiar su "nuevo ScriptBundle" a solo "nuevo paquete":

bundles.Add(new Bundle("~/bundles/modernizr").Include("~/Scripts/modernizr-*"));

Esto agrupará sus activos sin minificación. Me he topado con algunos casos en los que la minificación simplemente no funcionaría con ciertas bibliotecas, por lo que esto todavía te permitirá incluirlas en tu paquete.