Bundles ASP.NET comment désactiver la minification
J'ai debug="true" dans mes deux web.config (s), et je ne veux tout simplement pas que mes paquets soient minés, mais rien ne semble les désactiver. J'ai essayé enableoptimisations=false, voici mon code:
//Javascript
bundles.Add(new ScriptBundle("~/bundles/MainJS")
.Include("~/Scripts/regular/lib/mvc/jquery.validate.unobtrusive.js*")
.Include("~/Scripts/regular/lib/mvc/jquery.validate*")
.Include("~/Scripts/regular/lib/bootstrap.js")
.IncludeDirectory("~/Scripts/regular/modules", "*.js", true)
.IncludeDirectory("~/Scripts/regular/pages", "*.js", true)
.IncludeDirectory("~/Scripts/regular/misc", "*.js", true));
//CSS
bundles.Add(new StyleBundle("~/bundles/MainCSS")
.Include("~/Content/css/regular/lib/bootstrap.css*")
.IncludeDirectory("~/Content/css/regular/modules", "*.css", true)
.IncludeDirectory("~/Content/css/regular/pages", "*.css", true))
Si vous avez debug="true" dans web.config et utilisez Scripts/Styles.Render pour référencer les ensembles de vos pages, cela devrait désactiver l’association et la minification. BundleTable.EnableOptimizations = false désactivera toujours aussi bien le groupement que la minification (quel que soit le drapeau de débogage vrai/faux).
Vous n'utilisez peut-être pas les aides Scripts/Styles.Render? Si vous rendez directement des références à l'ensemble via BundleTable.Bundles.ResolveBundleUrl(), vous obtiendrez toujours le contenu minifié/fourni.
Les directives de compilation conditionnelle sont votre ami:
#if DEBUG
var jsBundle = new Bundle("~/Scripts/js");
#else
var jsBundle = new ScriptBundle("~/Scripts/js");
#endif
Pour désactiver le regroupement et la minification, il suffit de mettre ceci . Aspx fichier (cela désactivera l'optimisation même si debug=true dans web.config)
vb.net:
System.Web.Optimization.BundleTable.EnableOptimizations = false
c # .net
System.Web.Optimization.BundleTable.EnableOptimizations = false;
Si vous mettez EnableOptimizations = true, cela regroupera et minimisera même si debug=true dans web.config
Vous pouvez désactiver la minification dans vos liasses simplement en effaçant vos transformations.
var scriptBundle = new ScriptBundle("~/bundles/scriptBundle");
...
scriptBundle.Transforms.Clear();
J'ai personnellement trouvé cela utile lorsque je souhaitais regrouper tous mes scripts dans un seul fichier, mais que j'avais besoin de lisibilité pendant les phases de débogage.
J'ai essayé beaucoup de ces suggestions mais noter semblait fonctionner. J'ai perdu pas mal de temps pour découvrir que c'était mon erreur:
@Scripts.Render("/bundles/foundation")
Il m'a toujours javascript minified et bundled, peu importe ce que j'ai essayé. Au lieu de cela, j'aurais dû utiliser ceci:
@Scripts.Render("~/bundles/foundation")
Le '~' supplémentaire l'a fait. Je l'ai même retiré à nouveau dans un seul cas pour voir si c'était vraiment ça. C'était ... espérons pouvoir sauver au moins une personne les heures que j'ai perdues avec ça.
Combinez plusieurs réponses, cela fonctionne pour moi dans ASP.NET MVC 4.
bundles.Add(new ScriptBundle("~/Scripts/Common/js")
.Include("~/Scripts/jquery-1.8.3.js")
.Include("~/Scripts/zizhujy.com.js")
.Include("~/Scripts/Globalize.js")
.Include("~/Scripts/common.js")
.Include("~/Scripts/requireLite/requireLite.js"));
bundles.Add(new StyleBundle("~/Content/appLayoutStyles")
.Include("~/Content/AppLayout.css"));
bundles.Add(new StyleBundle("~/Content/css/App/FunGrapherStyles")
.Include("~/Content/css/Apps/FunGrapher.css")
.Include("~/Content/css/tables.css"));
#if DEBUG
foreach (var bundle in BundleTable.Bundles)
{
bundle.Transforms.Clear();
}
#endif
Il existe également un moyen simple de contrôler manuellement la minification (et d’autres fonctionnalités). C'est nouveau transformateur CssMinify () utilisant, comme ceci:
// this is in case when BundleTable.EnableOptimizations = false;
var myBundle = new StyleBundle("~/Content/themes/base/css")
.Include("~/Content/themes/base/jquery.ui.core.css" /* , ... and so on */);
myBundle.Transforms.Add(new CssMinify());
bundles.Add(myBundle);
// or you can remove that transformer in opposite situation
myBundle.Transforms.Clear();
C'est pratique lorsque vous souhaitez que certaines parties de la liasse ne soient que miniférées. Supposons que vous utilisiez des styles standard (jQuery) qui vous échappent (en leur faisant subir de nombreuses requêtes excessives de la part d'un navigateur), mais que vous souhaitez conserver votre propre feuille de style. (Idem - avec javascript).
J'ai combiné quelques réponses données par d'autres personnes dans cette question pour proposer une autre solution alternative.
Objectif: Pour toujours regrouper les fichiers, désactiver la minification JS et CSS dans le cas où <compilation debug="true" ... /> et appliquer systématiquement une transformation personnalisée à l'ensemble CSS.
Ma solution:
1) Dans web.config: <compilation debug="true" ... />
2) Dans la méthode Global.asax Application_Start ():
protected void Application_Start() {
...
BundleTable.EnableOptimizations = true; // Force bundling to occur
// If the compilation node in web.config indicates debugging mode is enabled
// then clear all transforms. I.e. disable Js and CSS minification.
if (HttpContext.Current.IsDebuggingEnabled) {
BundleTable.Bundles.ToList().ForEach(b => b.Transforms.Clear());
}
// Add a custom CSS bundle transformer. In my case the transformer replaces a
// token in the CSS file with an AppConfig value representing the website URL
// in the current environment. E.g. www.mydevwebsite in Dev and
// www.myprodwebsite.com in Production.
BundleTable.Bundles.ToList()
.FindAll(x => x.GetType() == typeof(StyleBundle))
.ForEach(b => b.Transforms.Add(new MyStyleBundleTransformer()));
...
}
Si vous définissez la propriété suivante sur false, cela désactivera l’association et la minification.
Dans le fichier Global.asax.cs, ajoutez la ligne comme indiqué ci-dessous
protected void Application_Start()
{
System.Web.Optimization.BundleTable.EnableOptimizations = false;
}
Voici comment désactiver la minification sur une base individuelle:
bundles.Add(new StyleBundleRaw("~/Content/foobarcss").Include("/some/path/foobar.css"));
bundles.Add(new ScriptBundleRaw("~/Bundles/foobarjs").Include("/some/path/foobar.js"));
Note: Les chemins utilisés pour vos ensembles ne doivent pas coïncider avec un chemin réel dans vos versions publiées, sinon rien ne fonctionnera. Veillez également à ne pas utiliser .js, .css et/ou '.' et '_' n'importe où dans le nom du paquet. Gardez le nom aussi simple et direct que possible, comme dans l'exemple ci-dessus.
Les classes d'assistance sont indiquées ci-dessous. Notez que pour rendre ces classes pérennes, nous supprimons chirurgicalement les occurrences minging js/css au lieu de .clear (). Nous insérons également une transformation mime-type-setter sans laquelle les versions de production risquent de se heurter à des ennuis, en particulier lorsque css-bundles (firefox et chrome rejettent les bundles css avec le type mime défini sur "text/html", qui est la valeur par défaut):
internal sealed class StyleBundleRaw : StyleBundle
{
private static readonly BundleMimeType CssContentMimeType = new BundleMimeType("text/css");
public StyleBundleRaw(string virtualPath) : this(virtualPath, cdnPath: null)
{
}
public StyleBundleRaw(string virtualPath, string cdnPath) : base(virtualPath, cdnPath)
{
Transforms.Add(CssContentMimeType); //0 vital
Transforms.Remove(Transforms.FirstOrDefault(x => x is CssMinify)); //0
}
//0 the guys at redmond in their infinite wisdom plugged the mimetype "text/css" right into cssminify upon unwiring the minifier we
// need to somehow reenable the cssbundle to specify its mimetype otherwise it will advertise itself as html and wont load
}
internal sealed class ScriptBundleRaw : ScriptBundle
{
private static readonly BundleMimeType JsContentMimeType = new BundleMimeType("text/javascript");
public ScriptBundleRaw(string virtualPath) : this(virtualPath, cdnPath: null)
{
}
public ScriptBundleRaw(string virtualPath, string cdnPath) : base(virtualPath, cdnPath)
{
Transforms.Add(JsContentMimeType); //0 vital
Transforms.Remove(Transforms.FirstOrDefault(x => x is JsMinify)); //0
}
//0 the guys at redmond in their infinite wisdom plugged the mimetype "text/javascript" right into jsminify upon unwiring the minifier we need
// to somehow reenable the jsbundle to specify its mimetype otherwise it will advertise itself as html causing it to be become unloadable by the browsers in published production builds
}
internal sealed class BundleMimeType : IBundleTransform
{
private readonly string _mimeType;
public BundleMimeType(string mimeType) { _mimeType = mimeType; }
public void Process(BundleContext context, BundleResponse response)
{
if (context == null)
throw new ArgumentNullException(nameof(context));
if (response == null)
throw new ArgumentNullException(nameof(response));
response.ContentType = _mimeType;
}
}
Pour que tout cela fonctionne, vous devez installer (via nuget):
WebGrease 1.6.0+ Microsoft.AspNet.Web.Optimization 1.1.3+
Et votre web.config devrait être enrichi comme suit:
<runtime>
[...]
<dependentAssembly>
<assemblyIdentity name="System.Web.Optimization" publicKeyToken="31bf3856ad364e35" />
<bindingRedirect oldVersion="1.0.0.0-x.y.z.t" newVersion="x.y.z.t" />
</dependentAssembly>
<dependentAssembly>
<assemblyIdentity name="WebGrease" publicKeyToken="31bf3856ad364e35" culture="neutral" />
<bindingRedirect oldVersion="0.0.0.0-x.y.z.t" newVersion="x.y.z.t" />
</dependentAssembly>
[...]
</runtime>
<!-- setting mimetypes like we do right below is absolutely vital for published builds because for some reason the -->
<!-- iis servers in production environments somehow dont know how to handle otf eot and other font related files -->
</system.webServer>
[...]
<staticContent>
<!-- in case iis already has these mime types -->
<remove fileExtension=".otf" />
<remove fileExtension=".eot" />
<remove fileExtension=".ttf" />
<remove fileExtension=".woff" />
<remove fileExtension=".woff2" />
<mimeMap fileExtension=".otf" mimeType="font/otf" />
<mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" />
<mimeMap fileExtension=".ttf" mimeType="application/octet-stream" />
<mimeMap fileExtension=".woff" mimeType="application/font-woff" />
<mimeMap fileExtension=".woff2" mimeType="application/font-woff2" />
</staticContent>
<!-- also vital otherwise published builds wont work https://stackoverflow.com/a/13597128/863651 -->
<modules runAllManagedModulesForAllRequests="true">
<remove name="BundleModule" />
<add name="BundleModule" type="System.Web.Optimization.BundleModule" />
</modules>
[...]
</system.webServer>
Notez que vous devrez peut-être prendre des mesures supplémentaires pour que vos css-bundles fonctionnent en termes de polices, etc. Mais c'est une histoire différente.
Pour compléter les réponses déjà données, si vous souhaitez également NON minifier/obscurcir/concaténer certains fichiers tout en permettant le regroupement et la minification complets d’autres fichiers , La meilleure option consiste à utiliser un moteur de rendu personnalisé qui lira le contenu d'un ensemble particulier et rendra les fichiers de la page plutôt que de rendre le chemin virtuel de l'ensemble. Personnellement, j’avais besoin de cela parce que IE 9 était $ *% @ ing lorsque je regroupais mes fichiers CSS , même si la minification était désactivée .
Merci beaucoup à cet article , qui m'a donné le point de départ pour le code que j'ai utilisé pour créer un rendu CSS qui rendrait les fichiers pour le CSS, tout en permettant au système de restituer mes fichiers javascript en lot/minified/obfuscated.
Création de la classe d'assistance statique:
using System;
using System.Text;
using System.Web;
using System.Web.Mvc;
using System.Web.Optimization;
namespace Helpers
{
public static class OptionalCssBundler
{
const string CssTemplate = "<link href=\"{0}\" rel=\"stylesheet\" type=\"text/css\" />";
public static MvcHtmlString ResolveBundleUrl(string bundleUrl, bool bundle)
{
return bundle ? BundledFiles(BundleTable.Bundles.ResolveBundleUrl(bundleUrl)) : UnbundledFiles(bundleUrl);
}
private static MvcHtmlString BundledFiles(string bundleVirtualPath)
{
return new MvcHtmlString(string.Format(CssTemplate, bundleVirtualPath));
}
private static MvcHtmlString UnbundledFiles(string bundleUrl)
{
var bundle = BundleTable.Bundles.GetBundleFor(bundleUrl);
StringBuilder sb = new StringBuilder();
var urlHelper = new UrlHelper(HttpContext.Current.Request.RequestContext);
foreach (BundleFile file in bundle.EnumerateFiles(new BundleContext(new HttpContextWrapper(HttpContext.Current), BundleTable.Bundles, bundleUrl)))
{
sb.AppendFormat(CssTemplate + Environment.NewLine, urlHelper.Content(file.VirtualFile.VirtualPath));
}
return new MvcHtmlString(sb.ToString());
}
public static MvcHtmlString Render(string bundleUrl, bool bundle)
{
return ResolveBundleUrl(bundleUrl, bundle);
}
}
}
Puis dans le fichier de mise en page du rasoir:
@OptionalCssBundler.Render("~/Content/css", false)
au lieu de la norme:
@Styles.Render("~/Content/css")
Je suis sûr que créer un moteur de rendu optionnel pour les fichiers javascript nécessiterait également peu de mises à jour pour cette aide.
Recherche de EnableOptimizations mot clé dans votre projet
Donc si vous trouvez
BundleTable.EnableOptimizations = true;
tournez-le false.
Si vous utilisez la transformation CSS LESS/SASS, l'option useNativeMinification peut être définie sur false pour désactiver la minification (dans web.config). Pour ce qui me concerne, je le modifie ici si besoin est, mais vous pouvez utiliser les transformations web.config pour toujours l'activer lors de la compilation ou bien trouver un moyen de le modifier dans le code.
<less useNativeMinification="false" ieCompat="true" strictMath="false"
strictUnits="false" dumpLineNumbers="None">
Astuce: L'intérêt de ceci est de voir votre CSS, ce que vous pouvez faire dans les outils d'inspection du navigateur ou en ouvrant simplement le fichier. Lorsque le regroupement est activé, le nom du fichier change à chaque compilation. Je place donc le texte suivant en haut de la page afin que je puisse visualiser facilement mon CSS compilé dans une nouvelle fenêtre du navigateur, chaque fois que celui-ci change.
@if (Debugger.IsAttached)
{
<a href="@Styles.Url(ViewBag.CSS)" target="css">View CSS</a>
}
ce sera une URL dynamique quelque chose comme https://example.com/Content/css/bundlename?v=UGd0FjvFJz3ETxlNN9NVqNOeYMRrOkQAkYtB04KisCQ1
Mise à jour: j'ai créé une transformation web.config pour qu'elle soit définie sur true lors de la génération du déploiement/de la version.
<bundleTransformer xmlns="http://tempuri.org/BundleTransformer.Configuration.xsd">
<less xdt:Transform="Replace" useNativeMinification="true" ieCompat="true" strictMath="false" strictUnits="false" dumpLineNumbers="None">
<jsEngine name="MsieJsEngine" />
</less>
</bundleTransformer>
Cela peut devenir utile à l'avenir car le nouveau cadre, une fois installé par VS, obtient un web.config, web.Debug.config et web.Release.config par défaut. Dans le web.release.config, vous trouverez cette ligne:
<compilation xdt:Transform="RemoveAttributes(debug)" />
cela semblait remplacer toutes les modifications en ligne que j'ai apportées. J'ai commenté cette ligne et nous étions en sauce (en termes de voir du code non minifié dans une version "release")