การรวมกลุ่ม ASP.NET วิธีการปิดการใช้งานการลดขนาด


185

ฉันมีdebug="true"ทั้งweb.config (s) ของฉันและฉันไม่ต้องการให้ชุดข้อมูลของฉันลดขนาดลง แต่ดูเหมือนไม่มีอะไรที่ฉันจะปิดการใช้งาน ฉันลองenableoptimisations=falseนี่คือรหัสของฉัน:

//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))

2
@ RickAnd-MSFT คำขอเป็นวิธีเปิดใช้งานการรวมกลุ่มในขณะที่ปิดการใช้งานการลดขนาด การใช้ web.config debug = true / false หรือ EnableOptimizations จะเปิดหรือปิดทั้งสองอย่างเท่านั้น คำตอบของ Martin Devillers อนุญาตให้ใช้งาน bundling ในขณะที่ minification ถูกปิดใช้งาน
guymid

2
สำหรับฉันด้วย .... สำหรับไฟล์ 'x.js' ในบันเดิลตรวจสอบให้แน่ใจว่าไม่มีไฟล์ 'x.min.js' ในโฟลเดอร์เป็นอย่างอื่นแม้ว่าคุณจะลบการแปลงการย่อขนาด .. การรวมกลุ่มจะให้บริการ ไฟล์ 'ย่อ' ก่อนหน้าเช่นถ้าคุณมี 'angular.js' แล้วลบ 'angular.min.js' ;-)
stooboo

คำตอบ:


137

ถ้าคุณมีdebug="true"ในweb.configและใช้Scripts/Styles.Renderเพื่อการอ้างอิงการรวมกลุ่มในหน้าเว็บของคุณที่ควรปิดทั้ง bundling และ minification BundleTable.EnableOptimizations = falseจะปิดทั้งการรวมและการย่อด้วยเช่นกัน (โดยไม่คำนึงถึงการดีบักแฟล็กจริง / เท็จ)

คุณอาจไม่ได้ใช้Scripts/Styles.Renderผู้ช่วยเหลือหรือไม่? หากคุณทำการอ้างอิงโดยตรงไปยังบันเดิลผ่านทางBundleTable.Bundles.ResolveBundleUrl()คุณจะได้รับเนื้อหาย่อ / รวม


12
จากคำตอบนี้ฉันไม่แน่ใจว่าจะปิดเพียงแค่การทำให้เป็น minification และปล่อย bundling ให้เข้าที่ - เป็นไปได้หรือไม่
Adam Tuliper - MSFT

33
ในการทำเช่นนี้วิธีที่ง่ายที่สุดคือการเปลี่ยน Script / StyleBundles สำหรับชุดรวมธรรมดาที่ไม่มีการแปลงชุดโดยค่าเริ่มต้นซึ่งจะปิด minification แต่ยังคงเป็นชุด หมายเหตุคุณจะต้องตั้งค่า EnableOptimizations เป็น true เพื่อให้การรวมกลุ่มเกิดขึ้น
Hao Kung

2
สำหรับฉันด้วย .... สำหรับไฟล์ 'x.js' ในบันเดิลตรวจสอบให้แน่ใจว่าไม่มีไฟล์ 'x.min.js' ในโฟลเดอร์เป็นอย่างอื่นแม้ว่าคุณจะลบการแปลงการย่อขนาด .. การรวมกลุ่มจะให้บริการ ไฟล์ 'ย่อ' ก่อนหน้าเช่นถ้าคุณมี 'angular.js' แล้วลบ 'angular.min.js' ;-)
stooboo

1
@stooboo นี่คือสิ่งที่แก้ไขสำหรับฉัน แต่คุณไม่จำเป็นต้องลบอะไรเลย เพียงแค่รวมไฟล์ที่ไม่ใช่นาที
OneHoopyFrood

2
EnableOptimizations = false- รหัสนี้อยู่ที่ไหน?
alex

158

คำสั่งการรวบรวมแบบมีเงื่อนไขเป็นเพื่อนของคุณ:

#if DEBUG
            var jsBundle = new Bundle("~/Scripts/js");
#else
            var jsBundle = new ScriptBundle("~/Scripts/js");
#endif

16
ที่จริงฉันคิดว่าเขาจับได้แล้ว - เพื่อปิด minification ให้ใช้ Bundle ตาม Hao หรือใช้ ScriptBundle ซึ่ง Bundle และ minifies ไม่ใช่เหรอ?
Adam Tuliper - MSFT

1
นี่เป็นโซลูชันที่ยอดเยี่ยมเมื่อคุณต้องการอ้างอิงบันเดิลด้วย URI การอ้างอิงบันเดิลสำหรับสิ่งต่าง ๆ เช่นการโหลดผ่าน RequireJS โดยไม่ต้องใช้บันเดิล / Minification ของ RequireJS
นอร์แมน H

1
ฉันเห็นสิ่งต่าง ๆ เช่นอดัมฉันเข้าใจ ScriptBundle เป็น Bundle ที่ปรับปรุงแล้วดังนั้นเมื่อคุณต้องการเพิ่มการอ้างอิงพื้นฐาน (ไม่มีการดำเนินการเฉพาะหลัง) Bundle ดูเหมือนจะเป็นวิธีที่ดีสำหรับฉันในการปิดการใช้งานการลดขนาดลงในกลุ่มเฉพาะ
Charles HETIER

6
@ RickAnd-MSFT ฉันคิดว่าคุณเข้าใจผิดวัตถุประสงค์ของรหัสนี้ซึ่งช่วยให้การรวม + ไม่มีการลดจำนวนในโหมดการดีบักและการรวม + การลดลงในโหมดการเปิดตัว การใช้ web.config debug = true / false หรือ EnableOptimizations จะเปิดหรือปิดทั้งสองอย่างเท่านั้น ฉันอ่านความคิดเห็นของคุณและยกเลิกวิธีการแก้ปัญหาของมาร์ตินนี้เท่านั้นที่จะพบว่ามันเป็นวิธีที่ดีมากของการรวมกลุ่มโดยไม่ต้องลดขนาดลง
guymid

-1 "ทางออก" นี้เป็นช่องว่างหยุดที่ดีที่สุด ในความเป็นจริงแม้ว่ามันจะใช้งานได้มันนำไปสู่การโค้ดที่ไม่มีวันหมด แต่นั่นไม่ใช่สิ่งที่เลวร้ายที่สุดเกี่ยวกับเรื่องนี้ การใช้ "Bundle" นำไปสู่สินทรัพย์ที่เซิร์ฟเวอร์ส่งมอบโดยตั้งค่าประเภท mime เป็น "text / html" แทนที่จะเป็น "text / javascript" หากคุณใช้วิธีการนี้สำหรับการรวมไฟล์ css ที่คุณกำลังเล่นด้วยไฟเมื่ออยู่ในโหมดแก้ไขข้อบกพร่อง อย่า ทำไม่ได้ ดูคำตอบของฉันสำหรับวิธีการที่ดีต่อสุขภาพซึ่งทำงานในการผลิตสร้าง
XDS

89

หากต้องการปิดใช้งานการรวมกลุ่มและการย่อขนาดให้ใส่ไฟล์. aspxของคุณ(สิ่งนี้จะปิดใช้งานการเพิ่มประสิทธิภาพแม้ว่าdebug=trueในweb.config )

vb.net:

System.Web.Optimization.BundleTable.EnableOptimizations = false

C # .net

System.Web.Optimization.BundleTable.EnableOptimizations = false;

หากคุณใส่EnableOptimizations = trueสิ่งนี้จะมัดและย่อให้เล็กลงแม้debug=trueในweb.config


2
นี่เป็นสิ่งเดียวที่แก้ไขปัญหาสำหรับฉัน ฉันมีdebug="true"และถูกต้องScript.Renderแต่มันก็ยังไม่ทำงาน นอกจากนี้โปรดทราบว่าการดำเนินการนี้จะไม่ใช้ไฟล์. min.js ใด ๆ ในเซิร์ฟเวอร์ดังนั้นโปรดรวมสำเนาของรหัสอ้างอิงที่ไม่ได้ระบุไว้ด้วย
OneHoopyFrood

2
@TCC: ฉันผิดที่คิดว่าไวยากรณ์ vb.net ควรมีทุนFalseหรือไม่
jeremysawesome

@ jeremysawesome โอ้ใช่ฉันคิดว่าถูกต้องจุดที่ดี :-) ฉันไม่ใช่โปรแกรมเมอร์ VB บ่อยมากดังนั้นฉันจึงไม่ได้สังเกต ...
TCC

1
บรรทัดแรกควรเป็น "... แม้ว่า debug = false" ไม่?
UnionP

2
vb.Net ไม่สนใจกรณี, False = false, .tostring () = .toString ()
นูเอล

67

คุณสามารถปิด minification ในชุดข้อมูลของคุณโดยการล้างการแปลงของคุณ

var scriptBundle = new ScriptBundle("~/bundles/scriptBundle");
...
scriptBundle.Transforms.Clear();

ฉันพบว่ามีประโยชน์นี้เป็นการส่วนตัวเมื่อต้องการรวมสคริปต์ของฉันทั้งหมดไว้ในไฟล์เดียว แต่จำเป็นต้องอ่านในระหว่างขั้นตอนการดีบัก


1
-1 นี่คือมังกร: การฉีก JsMinifier / CssMinifier ก็เป็นการฉีกกลไกภายในซึ่งกำหนดประเภท mime เป็น "text / css" หรือ "text / javascript" สิ่งนี้ไม่ทำให้เกิดปัญหาในโหมด debug / release แต่มันสร้างความหายนะใน css-bundles ในบริบทของ builds ที่เผยแพร่ (การใช้งานจริง): Chrome และ firefox ปฏิเสธที่จะโหลด css-bundles ระบุว่าประเภท mime ของพวกเขาถูกตั้งค่าเป็น "text / html" แทน "text / css" ด้วย js-bundles สิ่งที่ออกกำลังกายอย่างใด แต่คาวที่ดีที่สุดที่จะมี js-bundle มอบเป็น "text / html" (<- จริงจัง?) ดูคำตอบของฉันสำหรับวิธีการที่ถูกต้อง
XDS

28

ฉันลองใช้คำแนะนำเหล่านี้มากมาย แต่ดูเหมือนว่าจะใช้งานไม่ได้ ฉันเสียเวลาไปสองสามชั่วโมงกว่าจะพบว่านี่เป็นความผิดพลาดของฉัน:

@Scripts.Render("/bundles/foundation")

มันทำให้ฉันได้รับการย่อขนาดและจาวาสคริปต์แบบไม่ว่าฉันจะพยายามทำอะไร ฉันควรใช้สิ่งนี้แทน:

@Scripts.Render("~/bundles/foundation")

'~' พิเศษที่ทำมัน ฉันได้ลบมันออกไปอีกครั้งในครั้งเดียวเพื่อดูว่ามันเป็นจริงหรือไม่ มันคือ ... หวังว่าฉันจะสามารถประหยัดเวลาได้อย่างน้อยหนึ่งคนในเวลานี้


ว้าวฉันได้รับจะบ้าสำหรับที่ผ่านมา 3 ชั่วโมงกว่านี้ ...
Bodokh

24

รวมคำตอบต่าง ๆ เข้ากันได้กับ 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

21

นอกจากนี้ยังมีวิธีง่ายๆในการควบคุมการลดขนาด (และคุณสมบัติอื่น ๆ ) ด้วยตนเอง มันเป็นหม้อแปลง CssMinify () ใหม่ที่ใช้ดังนี้:

// 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();

สะดวกเมื่อคุณต้องการให้มีส่วนพิเศษบางอย่างรวมกลุ่มเท่านั้นที่จะย่อขนาดได้ สมมติว่าคุณกำลังใช้สไตล์มาตรฐาน (jQuery) ซึ่งอยู่ภายใต้การควบคุมของคุณ (รับคำขอเบราว์เซอร์ที่มากเกินไปสำหรับพวกเขา) แต่คุณต้องการรักษาสไตล์ชีทของคุณเองโดยไม่ จำกัด (เหมือนกัน - กับจาวาสคริปต์)


13

ฉันรวมคำตอบของคนอื่นในคำถามนี้เพื่อหาคำตอบอื่น

เป้าหมาย:เพื่อรวมไฟล์ทุกครั้งเพื่อปิดการใช้งานการลดขนาด JS และ CSS ในกรณีที่<compilation debug="true" ... />และใช้การแปลงแบบกำหนดเองกับบันเดิล CSS เสมอ

ทางออกของฉัน :

1) ในweb.config : <compilation debug="true" ... />

2) ในวิธีการ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()));
     ...
}

7

หากคุณตั้งค่าคุณสมบัติต่อไปนี้เป็นเท็จจะปิดใช้งานทั้งการรวมกลุ่มและการย่อขนาด

ในไฟล์Global.asax.csเพิ่มบรรทัดดังกล่าวด้านล่าง

protected void Application_Start()
{
    System.Web.Optimization.BundleTable.EnableOptimizations = false;
}

ฉันไม่เข้าใจว่าทำไมไฟล์น้อยของฉันถูกเปลี่ยนเป็น css เมื่อฉันปิดคุณสมบัตินี้ เมื่อฉันเปิดใช้งานการเพิ่มประสิทธิภาพการรวมไฟล์ให้น้อยลงจะไม่ทำงานอีกต่อไป
FrenkyB

5

ต่อไปนี้เป็นวิธีปิดใช้งานการลดขนาดเป็นกลุ่มต่อชุด:

bundles.Add(new StyleBundleRaw("~/Content/foobarcss").Include("/some/path/foobar.css"));
bundles.Add(new ScriptBundleRaw("~/Bundles/foobarjs").Include("/some/path/foobar.js"));

Sidenote: เส้นทางที่ใช้สำหรับบันเดิลของคุณจะต้องไม่ตรงกับเส้นทางที่เกิดขึ้นจริงในบิลด์ที่เผยแพร่ของคุณมิฉะนั้นจะไม่สามารถใช้งานได้ และอย่าลืมใช้. js, .css และ / หรือ '.' และ '_' ที่ใดก็ได้ในชื่อของบันเดิล ใช้ชื่อที่เรียบง่ายและตรงไปตรงมาที่สุดเท่าที่จะทำได้เช่นในตัวอย่างด้านบน

คลาสตัวช่วยแสดงอยู่ด้านล่าง โปรดสังเกตว่าเพื่อให้คลาสเหล่านี้เป็นหลักฐานในอนาคตเราจึงทำการลบอินสแตนซ์ js / css ที่มีขนาดเล็กแทนการใช้. clear () และเรายังแทรกการแปลง mime-type-setter โดยที่การสร้างจะถูกสร้างขึ้นโดยเฉพาะเมื่อ มันมาถึงการส่ง css-bundles อย่างเหมาะสม (firefox และ chrome ปฏิเสธ css bundles ด้วย mime-type set เป็น "text / html" ซึ่งเป็นค่าเริ่มต้น):

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

ในการทำให้สิ่งทั้งหมดนี้ทำงานคุณต้องติดตั้ง (ผ่านทาง nuget):

WebGrease 1.6.0+ Microsoft.AspNet.Web.Optimization 1.1.3+

และเว็บของคุณควรได้รับการเสริมคุณค่าเช่น:

<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>

โปรดทราบว่าคุณอาจต้องทำตามขั้นตอนพิเศษเพื่อให้ css-bundles ของคุณทำงานในรูปแบบของตัวอักษรเป็นต้น แต่นั่นเป็นเรื่องที่แตกต่าง


4

เพียงเพื่อเสริมคำตอบที่ได้รับไปแล้วหากคุณไม่ต้องการลดขนาด / obfuscate / concatenate บางไฟล์ในขณะที่ยังคงให้การรวมกลุ่มและ minification เต็มสำหรับไฟล์อื่น ๆตัวเลือกที่ดีที่สุดคือไปกับ renderer ที่กำหนดเองซึ่งจะอ่านเนื้อหาของมัด (s) และแสดงไฟล์ในหน้าแทนที่จะแสดงผลเส้นทางเสมือนของบันเดิล ฉันต้องการสิ่งนี้เป็นการส่วนตัวเพราะ IE 9 คือ $ *% @ ติดเตียงเมื่อไฟล์ CSS ของฉันถูกรวมเข้าด้วยกันแม้จะมีการปิด minificationปิด

ขอบคุณมากสำหรับบทความนี้ซึ่งทำให้ฉันเป็นจุดเริ่มต้นสำหรับรหัสที่ฉันใช้ในการสร้าง CSS Renderer ซึ่งจะแสดงไฟล์สำหรับ CSS แต่ยังอนุญาตให้ระบบแสดงไฟล์ javascript ของฉันรวม / minified / obfuscated

สร้างคลาสตัวช่วยคงที่:

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

}

จากนั้นในไฟล์เลย์เอาต์มีดโกน:

@OptionalCssBundler.Render("~/Content/css", false)

แทนมาตรฐาน:

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

ฉันแน่ใจว่าการสร้าง renderer ที่เป็นตัวเลือกสำหรับไฟล์จาวาสคริปต์จะต้องมีการอัพเดทตัวช่วยเล็กน้อยเช่นกัน


1
ทำได้ดี. หากคุณต้องการ URL ที่จะเปลี่ยนแปลงเมื่อมีการอัปเดตไฟล์คุณสามารถเปลี่ยนCssTemplateเป็นอย่างเช่น"<link href=\"{0}?f={1}\" rel=\"stylesheet\" type=\"text/css\" />"และเปลี่ยนsb.AppendFormatบรรทัดเป็นสิ่งที่ต้องการsb.AppendFormat(CssTemplate + Environment.NewLine, urlHelper.Content(file.VirtualFile.VirtualPath), System.IO.File.GetLastWriteTimeUtc(HttpContext.Current.Server.MapPath(file.IncludedVirtualPath)).Ticks);
franzo

จริงเราทำอะไรมากมายอย่างเช่นที่ทำงาน เรามีสแตติกสาธารณะที่เรียกว่า JSVersion ที่เราใส่ลงในคลาส Global.asax ซึ่งดึง maj / min / build / rev ของแอสเซมบลีที่ดำเนินการ จากนั้นเราจะอ้างอิงเช่นนี้: <script type = "text / javascript" src = "Scripts / jsfile_name.js <% = Global.JSVersion%>"> </script>
James Eby

3

ค้นหา EnableOptimizationsคำสำคัญในโครงการของคุณ

ดังนั้นหากพบ

BundleTable.EnableOptimizations = true;

falseเปิด


2
นี่เป็นการปิดการใช้งาน minification แต่มันก็ปิดการใช้งาน bundling ทั้งหมดซึ่งฉันคิดว่าอย่างน้อยควรมีการบันทึกไว้
John Pavek

1

หากคุณกำลังใช้การแปลง LESS / SASS CSS มีตัวเลือกuseNativeMinificationที่สามารถตั้งค่าเป็นเท็จเพื่อปิดใช้งานการลดขนาด (ใน web.config) เพื่อจุดประสงค์ของฉันฉันเพิ่งเปลี่ยนที่นี่เมื่อฉันต้องการ แต่คุณสามารถใช้การแปลง web.config เพื่อเปิดใช้งานในการสร้างรุ่นหรืออาจหาวิธีแก้ไขในรหัส

<less useNativeMinification="false" ieCompat="true" strictMath="false"
      strictUnits="false" dumpLineNumbers="None">

เคล็ดลับ:ประเด็นทั้งหมดนี้คือการดู CSS ของคุณซึ่งคุณสามารถทำได้ในเบราว์เซอร์ตรวจสอบเครื่องมือหรือเพียงแค่เปิดไฟล์ เมื่อเปิดการใช้งานบันเดิลนั้นชื่อไฟล์จะเปลี่ยนไปในคอมไพล์ทุกครั้งดังนั้นฉันจึงใส่ต่อไปนี้ไว้ที่ด้านบนของหน้าเพื่อให้ฉันสามารถดู CSS eaily ที่คอมไพล์แล้วในหน้าต่างเบราว์เซอร์ใหม่ทุกครั้งที่มีการเปลี่ยนแปลง

@if (Debugger.IsAttached) 
{
    <a href="@Styles.Url(ViewBag.CSS)" target="css">View CSS</a>
}

นี่จะเป็น URL แบบไดนามิกที่มีลักษณะคล้ายกัน https://example.com/Content/css/bundlename?v=UGd0FjvFJz3ETxlNN9NVqNOeYMRrOkQAkYtB04KisCQ1


อัปเดต: ฉันสร้างการแปลง web.config เพื่อตั้งค่าเป็นจริงสำหรับฉันในระหว่างการปรับใช้ / วางบิล

  <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>

1
ชื่อไฟล์จะไม่เปลี่ยนแปลงในการรวบรวมทุกครั้ง มันขึ้นอยู่กับเนื้อหาของไฟล์ดังนั้นมันจึงเปลี่ยนแปลงทุกครั้งที่มีการเปลี่ยนแปลงไฟล์
Jim Raden

1

นี้อาจจะเป็นประโยชน์กับใครสักคนในอนาคตเป็นกรอบการทำงานใหม่เมื่อการติดตั้งผ่าน VS ได้รับการเริ่มต้นweb.config, และweb.Debug.config web.Release.configในweb.release.configบรรทัดนี้คุณจะพบ:

<compilation xdt:Transform="RemoveAttributes(debug)" />

นี่ดูเหมือนจะแทนที่การเปลี่ยนแปลงแบบอินไลน์ใด ๆ ที่ฉันทำ ฉันแสดงความคิดเห็นในบรรทัดนี้และเราก็มีน้ำเกรวี่

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.