Comment désactiver la minification JavaScript / CSS dans ASP.NET MVC 4 Beta

StackOverflow https://stackoverflow.com/questions/9373071

Question

J'essaie simplement ASP.NET MVC 4 mais je ne peux pas comprendre comment désactiver la fonction de minification JavaScript / CSS. Surtout pour l'environnement de développement, cela aidera grandement à déboguer. J'imagine que ce serait un commutateur dans web.config, mais comme ASP.NET MVC 4 est toujours en scène bêta pour le moment, il n'y a vraiment pas beaucoup d'informations. J'apprécierais que quelqu'un puisse aider ou indiquer les bons articles de blog, etc.

Était-ce utile?

La solution

Dans global.asax.cs

#if DEBUG
        foreach (var bundle in BundleTable.Bundles)
        {
            bundle.Transform = new NoTransform();
        }
#endif

Autres conseils

Une autre option serait de créer une aide HTML que vous pourriez utiliser pour créer les balises de script et de liaison. Voici ce que j'ai implémenté pour le JavaScript, qui peut également être fait pour le CSS:

public static class BundleHelper
    {
        public static MvcHtmlString JsBundle(this HtmlHelper helper, string bundlePath)
        {
            var jsTag = new TagBuilder("script");
            jsTag.MergeAttribute("type", "text/javascript");

            return ReferenceBundle(helper, bundlePath, jsTag);
        }

        public static MvcHtmlString ReferenceBundle(this HtmlHelper helper, string bundlePath, TagBuilder baseTag)
        {
            var httpContext = helper.ViewContext.HttpContext;
            var urlHelper = new UrlHelper(helper.ViewContext.RequestContext);

            Bundle bundle = BundleTable.Bundles.GetBundleFor(bundlePath);
            var htmlString = new StringBuilder();

            if (bundle != null)
            {
                var bundleContext = new BundleContext(helper.ViewContext.HttpContext, BundleTable.Bundles, urlHelper.Content(bundlePath));

                if (!httpContext.IsDebuggingEnabled)
                {
                    baseTag.MergeAttribute("href", System.Web.Optimization.BundleTable.Bundles.ResolveBundleUrl(bundlePath));
                    return new MvcHtmlString(baseTag.ToString());
                }

                foreach (var file in bundle.EnumerateFiles(bundleContext))
                {
                    var basePath = httpContext.Server.MapPath("~/");
                    if (file.FullName.StartsWith(basePath))
                    {
                        var relPath = urlHelper.Content("~/" + file.FullName.Substring(basePath.Length));
                        baseTag.MergeAttribute("href", relPath, true);
                        htmlString.AppendLine(baseTag.ToString());
                    }
                }

            }

            return new MvcHtmlString(htmlString.ToString());
        }
    }

Maintenant, tout ce que vous avez à faire est de l'appeler à votre avis:

<head>
    <meta charset="utf-8" />
    <title>@ViewBag.Title - My ASP.NET MVC Application</title>
    <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <link href="~/Content/css" rel="stylesheet" type="text/css" />
    <link href="~/Content/themes/base/css" rel="stylesheet" type="text/css" />
    @Html.JsBundle("~/scripts/js")
    <meta name="viewport" content="width=device-width" />
</head>

Et il rendra les scripts comme références distinctes, ou utilisera la nouvelle fonctionnalité de regroupement / minification en fonction du paramètre de débogage dans votre web.config. J'ai utilisé une partie du code de http://codecutout.com/resource-minify-bunling comme référence lors de la création de mon aide si vous vouliez voir d'autres exemples. Leur aide est écrite un peu mieux, lançant des exceptions lorsque des arguments non valides sont fournis, etc. ... Je n'ai tout simplement pas encore pu nettoyer le mien.

Vous pouvez enregistrer vos propres paquets dans le Global.asax et utilisez le NoTransform classe si vous ne voulez pas que le contenu soit minifié.

Personnellement, je ne veux pas du tout que mon script soit transformé. Je crée juste deux répertoires de scripts. Un avec les versions de script de débogage et une avec les versions minifiées à l'origine téléchargées.

Le minificateur MVC 4 hors de la boîte (JSMINIFY) rompt JQuery 1.7.1 pour l'opéra, donc je ne veux pas utiliser celui-ci. Je viens de mettre les lignes suivantes dans mon Global.asax: Application_Start() méthode:

Bundle debugScripts = new Bundle("~/DebugScripts", 
    new NoTransform("text/javascript"));
debugScripts.AddDirectory("~/Scripts/Debug", "*.js");
BundleTable.Bundles.Add(debugScripts);

Bundle productionScripts = new Bundle("~/ProductionScripts", 
    new NoTransform("text/javascript"));
productionScripts.AddDirectory("~/Scripts/Minified", "*.js");
BundleTable.Bundles.Add(productionScripts);

Avec cela en place, je peux simplement ajouter l'une ou l'autre des deux lignes de mon _layouts.cshtml:

<script src="@System.Web.Optimization.BundleTable.Bundles.ResolveBundleUrl("~/DebugScripts")" type="text/javascript"></script>
<script src="@System.Web.Optimization.BundleTable.Bundles.ResolveBundleUrl("~/ProductionScripts")" type="text/javascript"></script>

Bien sûr, nous pourrions devenir un peu plus funky avec cela en place. Nous pourrions générer un seul bundle et en fonction du type construit, sélectionnez les fichiers à inclure.

Après l'appel à EnableDefaultBundles() Dans Global.asax, vous pouvez le faire ...

        if ( ... running in development environment ...)
        {
            var registeredBundles = BundleTable.Bundles.GetRegisteredBundles();
            foreach (var bundle in registeredBundles)
            {
                if (bundle.Transform is System.Web.Optimization.JsMinify)
                    bundle.Transform = new NoTransform();
            }
        }

Pas joli (modification de l'état défini par le système), mais c'est beaucoup moins de code que toutes les autres suggestions, vous permet toujours d'utiliser le comportement de regroupement standard et cela n'implique aucune modification de vos vues.

Sur les versions plus récentes d'Asp.net MVC, il suffit d'ajouter

#if DEBUG
            foreach (var bundle in BundleTable.Bundles)
            {
                bundle.Transforms.Clear();
            }
#endif

juste après

BundleConfig.RegisterBundles(...);

vous pouvez le désactiver de la configuration:

<system.web>
    <compilation debug="true" />
    <!-- Lines removed for clarity. -->
</system.web>

http://www.asp.net/mvc/tutorials/mvc-4/bundling-and-minification

Je pense que ce serait juste si une telle fonctionnalité sera disponible "Out of the Box".

J'ai publié des commentaires sur userservoice.com: http://aspnet.uservoice.com/forums/41201-asp-net-mvc/suggestions/2702000-improve-system-web-optimisation-bundle

Donnez-lui vos "voix".

Plutôt que de remplacer les instances de jsminify et cssminify, on peut à la place utiliser des interfaces. Cette option n'était pas disponible dans les versions précédentes car le deuxième paramètre du constructeur était un type plutôt qu'une interface.

IBundleTransform jsTransform;
IBundleTransform cssTransform;

#if DEBUG
    jsTransform = new NoTransform("text/javascript");
    cssTransform = new NoTransform("text/css");
#else
    jsTransform = new JsMinify();
    cssTransform = new CssMinify();
#endif

Bundle jsBundle = new Bundle("~/JsB", jsTransform);
Bundle cssBundle = new Bundle("~/CssB", cssTransform);

Peut-être que la peine d'être notée, pour les scripts expédiés avec des versions minifiées et non minifiées, par exemple jQuery, on peut utiliser une méthode d'assistance pour éliminer éventuellement le ".min" pour les versions de débogage pour faciliter le débogage:

private string Min(string scriptNameIncludingMin)
{
#if DEBUG
    return scriptNameIncludingMin.Replace(".min", ""); // Remove .min from debug builds
#else
    return scriptNameIncludingMin;
#endif
}

// ...
jsBundle.AddFile(Min("~/Scripts/jquery-1.7.2.min.js"));

Essayez une nouvelle extension pour System.web.optimisation - Transformateur de faisceau. Dans Bundle, le transformateur a mis en œuvre un certain nombre d'occasions de simplification du débogage (voir Documentation).

Une autre alternative (testée avec V1.1.0.0 et MVC5):

public class BundleConfig
{
    public static void Register()
    {
        ScriptBundle jsBundle = new ScriptBundle("~/Scripts/myscript.min.js");
        jsBundle.Include("~/Scripts/myscript.js");
        DisableInDebugMode(jsBundle);

        BundleTable.Bundles.Add(jsBundle);
    }

    private static void DisableInDebugMode(ScriptBundle jsBundle)
    {
    #if DEBUG
        // Don't minify in debug mode
        jsBundle.Transforms.Clear();
    #endif
    }
}
Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top