web-dev-qa-db-fra.com

Le regroupement de scripts ASP.NET MVC 4 provoque des erreurs lors du déploiement

Mon site Web fonctionne correctement sur localhost lorsque @Scripts.Render() ne regroupe pas les scripts. Toutefois, lorsque je déploie sur mon serveur, le code Javascript fourni doit contenir une erreur, car tout le code JavaScript de ma page ne fonctionne plus.

Voici mon code bundle:

        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"));
        }

Voici mon code de rendu:

@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")

Quelqu'un peut-il expliquer ce qui pourrait arriver à mon code Javascript lors du déploiement?

Merci, Alex.

17
Alex Hope O'Connor

Vous pouvez également changer votre "nouveau ScriptBundle" en "nouvel ensemble":

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

Cela regroupera vos actifs sans minification. J'ai rencontré des cas où la minification ne fonctionnait tout simplement pas avec certaines bibliothèques, donc cela vous permettra quand même de les inclure dans votre bundle.

18
Ryan Ferretti

Habituellement, la seule différence entre les ensembles de débogage et déployés est que les optimisations sont désactivées lors du débogage.

Lorsque les optimisations sont activées, la minification peut mettre en évidence une erreur de syntaxe qui serait pardonnée en cas de saut de ligne. Par exemple:

var x = 10
var y = 15

Non minifié, cela fonctionnerait probablement - mais minified vous vous retrouvez avec ...

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

Ce qui ne fonctionnera pas - vous avez besoin des caractères ; manquants.

Si vous déboguez le script, vous devriez pouvoir voir où se trouve l'erreur.

8
Fenton

La minification "fonctionne" même si des erreurs apparaissent

La vraie solution à cela est:

  • Exclure les fichiers .min et .mapAVANTvous publiez

Et la minification fonctionnera. En fait, le processus de minification fonctionne toujours!

Si "ça marche", qu'est-ce qui se passe réellement: pourquoi avons-nous une erreur?

ASP.Net semble utiliser les fichiers .min en priorité lors de l'intégration d'optimisations activées. Il intégrera donc le code dans les fichiers .min et ajoutera chaque fichier javascript l'un après l'autre sans ajouter de sauts de ligne.

C'est le navigateur qui ne comprend pas pourquoi il existe un commentaire potentiel/* Après la configuration du mappage minimal: // # sourceMappingURL = jquery.history.min.js.map Parce que les fichiers groupés ressemblent à:

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

Il existe deux solutions pour éviter cette erreur:

  • Créez des ensembles distincts pour les fichiers javascript qui ne peuvent pas suivre (c'est comme si vous n'activiez pas la fonctionnalité d'ensemble).
  • Créer un paquet qui ne permettra pas la minification (mauvais)
  • Ou une alternative: exclure tous les fichiers minifiés ou les fichiers min.js qui ont un sourceMappingURL (ou modifient leur source) et des fichiers .map

L'objectif serait de forcer ASP.Net à régénérer des fichiers min lui-même (et ASP.Net ne créera pas // sourceMappingUrl dans son fichier généré, il ne résoudra donc pas ce problème).

Le vrai problème est donc la mise en œuvre actuelle de cette fonctionnalité dans les navigateurs, car elle ne semble pas pouvoir analyser les commentaires pour les commentaires de la cartographie source. Il existe peut-être un autre moyen d'indiquer au navigateur que sourceMappingUrl a pris fin.

8
Micaël Félix

Vérifiez cette solution
Configuration IIS> Authentification> Authentification anonyme RightClickOn> Cliquez sur Edition> Vérifier l'identité du pool d'applications 

Tiré de ici .

0
shiroxx