दिलचस्प पोस्ट
जावा जेनेरिक संप्रदाय चल रहे मानक विचलन को कुशलतापूर्वक कैसे गणना करें? गेट मौजूदा रेपो को एक नया और अलग रिमोट रेपो सर्वर पर रखता है? आईफोन से अग्रेषित जीओकोडिंग मैक ओएस एक्स 10.8 / एक्सकोड 4.4 पर जीसीसी का उपयोग कैसे करें जावास्क्रिप्ट में लूप रूपांतरण करते समय पायथन अरा # नक्शा के साथ parseInt उपज नाएनएन क्यों करता है? कम उपयोग किए बिना बूटस्ट्रैप navbar पतन ब्रेकपेज बदलें हाइबरनेट में प्रथम और द्वितीय स्तर की कैशिंग क्या है? एक mysql डेटाबेस को कमांड लाइन से एक सादा पाठ (सीएसवी) बैकअप में डालें सिंगल app.config बहु-परियोजना सी # बाध्यकारी माध्यम से कैनवास में आइटम कैसे प्रदर्शित करें दो भिन्न सर्वर से तालिकाओं में शामिल हों एंड्रॉइड स्टूडियो: आईडी 'एंड्रॉइड-लाइब्रेरी' वाला प्लगइन नहीं मिला चेतावनी से छुटकारा कैसे प्राप्त करें: पीडब्ल्यूसी 4011: यूटीएफ -8 में अनुरोध वर्ण एन्कोडिंग सेट करने में असमर्थ

MVC4 स्टाइलबंडल चित्रों को हल नहीं कर रहा है

मेरा प्रश्न इस के समान है:

एएसपी.नेट एमवीसी 4 मिनिफिकेशन और पृष्ठभूमि छवियां

सिवाय इसके कि मैं एमवीसी के स्वयं के बंडलिंग के साथ रहना चाहता हूं यदि मैं कर सकता हूं। मैं एक मस्तिष्क दुर्घटना का पता लगाने की कोशिश कर रहा हूं कि शैली के बंडलों को निर्दिष्ट करने के लिए सही पैटर्न क्या है, जैसे कि स्टैंडअलोन सीएसएस और छवि सेट जैसे कि jQuery UI काम

मेरे पास /Content/css/ साथ एक विशिष्ट एमवीसी साइट संरचना है जिसमें मेरी बेस सीएसएस जैसे styles.css शामिल हैं I उस सीएसएस फ़ोल्डर में मेरे पास सबफ़ोल्डर्स जैसे /jquery-ui जिसमें इसकी सीएसएस फाइल प्लस ए /images फ़ोल्डर है। JQuery के यूआई सीएसएस में छवि पथ उस फ़ोल्डर के सापेक्ष हैं और मैं उनके साथ गड़बड़ नहीं करना चाहता।

जैसा कि मैं इसे समझता हूं, जब मैं एक StyleBundle निर्दिष्ट करता StyleBundle मुझे एक आभासी पथ निर्दिष्ट करने की आवश्यकता होती है जो किसी वास्तविक सामग्री पथ से मेल नहीं खाता, क्योंकि (मानते हुए कि मैं सामग्री को मार्गों की अनदेखी कर रहा हूं) IIS फिर उस पथ को भौतिक फ़ाइल के रूप में हल करने का प्रयास करेगा । इसलिए मैं निर्दिष्ट कर रहा हूं:

 bundles.Add(new StyleBundle("~/Content/styles/jquery-ui") .Include("~/Content/css/jquery-ui/*.css")); 

का उपयोग करके प्रदान किया गया:

 @Styles.Render("~/Content/styles/jquery-ui") 

मैं इस बारे में अनुरोध कर सकता हूं:

 http://localhost/MySite/Content/styles/jquery-ui?v=nL_6HPFtzoqrts9nwrtjq0VQFYnhMjY5EopXsK8cxmg1 

यह सही, minified सीएसएस प्रतिक्रिया लौट रहा है। लेकिन फिर ब्राउज़र अपेक्षाकृत लिंक की गई छवि के लिए एक अनुरोध भेजता है:

 http://localhost/MySite/Content/styles/images/ui-bg_highlight-soft_100_eeeeee_1x100.png 

जो एक 404

मैं समझता हूं कि मेरे यूआरएल के अंतिम भाग jquery-ui एक एक्सटेंशनलेस यूआरएल है, जो मेरे बंडल के लिए एक हैंडलर है, इसलिए मैं देख सकता हूँ कि छवि के लिए सापेक्ष अनुरोध केवल /styles/images/

तो मेरा सवाल यह है कि इस स्थिति को संभालने का सही तरीका क्या है ?

वेब के समाधान से एकत्रित समाधान "MVC4 स्टाइलबंडल चित्रों को हल नहीं कर रहा है"

MVC4 सीएसएस बंडलिंग और छवि संदर्भों पर इस धागे के अनुसार, यदि आप अपनी बंडल को परिभाषित करते हैं:

 bundles.Add(new StyleBundle("~/Content/css/jquery-ui/bundle") .Include("~/Content/css/jquery-ui/*.css")); 

जहां आप बंडल के स्रोत फ़ाइलों के समान पथ पर बंडल को परिभाषित करते हैं, जहां रिश्तेदार छवि पथ अभी भी काम करेंगे बंडल पथ का अंतिम भाग वास्तव में उस विशिष्ट बंडल के लिए file name है (यानी, /bundle आपके पसंदीदा नाम हो सकता है)।

यह केवल तभी काम करेगा यदि आप एक ही फोल्डर से सीएसएस एकत्र कर रहे हैं (जो मुझे लगता है कि एक बंडलिंग परिप्रेक्ष्य से समझ में आता है)

अद्यतन करें

@ हाओ कुंग द्वारा नीचे दिए गए टिप्पणी के अनुसार, वैकल्पिक रूप से यह अब एक CssRewriteUrlTransformation ( बंडल करते समय सीएसएस फ़ाइलों के रिश्तेदार यूआरएल संदर्भों को बदलने) को लागू करने के द्वारा प्राप्त किया जा सकता है।

नोट: मैंने वर्चुअल निर्देशिका के भीतर पूर्ण पथ को फिर से लिखने के मुद्दों के बारे में टिप्पणियों की पुष्टि नहीं की है, इसलिए ये सभी के लिए काम नहीं कर सकता (?)

 bundles.Add(new StyleBundle("~/Content/css/jquery-ui/bundle") .Include("~/Content/css/jquery-ui/*.css", new CssRewriteUrlTransform())); 

ग्रिन / द पीरेट समाधान अच्छी तरह से काम करता है

मुझे यह पसंद नहीं था कि वह बंडल पर शामिल विधि को नया करे, और यह सामग्री निर्देशिका में अस्थायी फ़ाइलों को बनाया। (वे अंत में जांच की जा रही है, तैनात, तो सेवा शुरू नहीं होगा!)

तो बंडलिंग के डिजाइन का पालन करने के लिए, मैं अनिवार्य रूप से एक ही कोड को कार्यान्वित करने के लिए चुना, लेकिन एक IBundleTransform कार्यान्वयन में ::

 class StyleRelativePathTransform : IBundleTransform { public StyleRelativePathTransform() { } public void Process(BundleContext context, BundleResponse response) { response.Content = String.Empty; Regex pattern = new Regex(@"url\s*\(\s*([""']?)([^:)]+)\1\s*\)", RegexOptions.IgnoreCase); // open each of the files foreach (FileInfo cssFileInfo in response.Files) { if (cssFileInfo.Exists) { // apply the RegEx to the file (to change relative paths) string contents = File.ReadAllText(cssFileInfo.FullName); MatchCollection matches = pattern.Matches(contents); // Ignore the file if no match if (matches.Count > 0) { string cssFilePath = cssFileInfo.DirectoryName; string cssVirtualPath = context.HttpContext.RelativeFromAbsolutePath(cssFilePath); foreach (Match match in matches) { // this is a path that is relative to the CSS file string relativeToCSS = match.Groups[2].Value; // combine the relative path to the cssAbsolute string absoluteToUrl = Path.GetFullPath(Path.Combine(cssFilePath, relativeToCSS)); // make this server relative string serverRelativeUrl = context.HttpContext.RelativeFromAbsolutePath(absoluteToUrl); string quote = match.Groups[1].Value; string replace = String.Format("url({0}{1}{0})", quote, serverRelativeUrl); contents = contents.Replace(match.Groups[0].Value, replace); } } // copy the result into the response. response.Content = String.Format("{0}\r\n{1}", response.Content, contents); } } } } 

और फिर इसे एक बंडल उलझाव में लिपटे:

 public class StyleImagePathBundle : Bundle { public StyleImagePathBundle(string virtualPath) : base(virtualPath) { base.Transforms.Add(new StyleRelativePathTransform()); base.Transforms.Add(new CssMinify()); } public StyleImagePathBundle(string virtualPath, string cdnPath) : base(virtualPath, cdnPath) { base.Transforms.Add(new StyleRelativePathTransform()); base.Transforms.Add(new CssMinify()); } } 

नमूना उपयोग:

 static void RegisterBundles(BundleCollection bundles) { ... bundles.Add(new StyleImagePathBundle("~/bundles/Bootstrap") .Include( "~/Content/css/bootstrap.css", "~/Content/css/bootstrap-responsive.css", "~/Content/css/jquery.fancybox.css", "~/Content/css/style.css", "~/Content/css/error.css", "~/Content/validation.css" )); 

RelativeFromAbsolutePath के लिए यहां मेरा विस्तार तरीका है:

  public static string RelativeFromAbsolutePath(this HttpContextBase context, string path) { var request = context.Request; var applicationPath = request.PhysicalApplicationPath; var virtualDir = request.ApplicationPath; virtualDir = virtualDir == "/" ? virtualDir : (virtualDir + "/"); return path.Replace(applicationPath, virtualDir).Replace(@"\", "/"); } 

बेहतर अभी तक (आईएमएचओ) एक कस्टम बंडल को लागू करता है जो छवि पथ को ठीक करता है। मैंने अपने ऐप के लिए एक लिखा था

 using System; using System.Collections.Generic; using IO = System.IO; using System.Linq; using System.Text.RegularExpressions; using System.Web; using System.Web.Optimization; 

 public class StyleImagePathBundle : Bundle { public StyleImagePathBundle(string virtualPath) : base(virtualPath, new IBundleTransform[1] { (IBundleTransform) new CssMinify() }) { } public StyleImagePathBundle(string virtualPath, string cdnPath) : base(virtualPath, cdnPath, new IBundleTransform[1] { (IBundleTransform) new CssMinify() }) { } public new Bundle Include(params string[] virtualPaths) { if (HttpContext.Current.IsDebuggingEnabled) { // Debugging. Bundling will not occur so act normal and no one gets hurt. base.Include(virtualPaths.ToArray()); return this; } // In production mode so CSS will be bundled. Correct image paths. var bundlePaths = new List<string>(); var svr = HttpContext.Current.Server; foreach (var path in virtualPaths) { var pattern = new Regex(@"url\s*\(\s*([""']?)([^:)]+)\1\s*\)", RegexOptions.IgnoreCase); var contents = IO.File.ReadAllText(svr.MapPath(path)); if(!pattern.IsMatch(contents)) { bundlePaths.Add(path); continue; } var bundlePath = (IO.Path.GetDirectoryName(path) ?? string.Empty).Replace(@"\", "/") + "/"; var bundleUrlPath = VirtualPathUtility.ToAbsolute(bundlePath); var bundleFilePath = String.Format("{0}{1}.bundle{2}", bundlePath, IO.Path.GetFileNameWithoutExtension(path), IO.Path.GetExtension(path)); contents = pattern.Replace(contents, "url($1" + bundleUrlPath + "$2$1)"); IO.File.WriteAllText(svr.MapPath(bundleFilePath), contents); bundlePaths.Add(bundleFilePath); } base.Include(bundlePaths.ToArray()); return this; } } 

इसका उपयोग करने के लिए, करें:

 bundles.Add(new StyleImagePathBundle("~/bundles/css").Include( "~/This/Is/Some/Folder/Path/layout.css")); 

…के बजाय…

 bundles.Add(new StyleBundle("~/bundles/css").Include( "~/This/Is/Some/Folder/Path/layout.css")); 

यह क्या करता है (जब डिबग मोड में नहीं) url(<something>) को ढूंढता है और इसे url(<absolute\path\to\something>) साथ बदल देता है। मैंने लगभग 10 सेकंड पहले चीज लिखी थी, इसलिए इसे थोड़ी-बहुत ज़ोर देने की आवश्यकता हो सकती है मैंने सुनिश्चित किया है कि यूआरएल पथ में कोई बृहदान्त्र (:) नहीं है, यह सुनिश्चित करके मैंने पूरी तरह से योग्य यूआरएल और बेस 64 डेटार्स का ध्यान रखा है। हमारे पर्यावरण में, छवियां सामान्य रूप से एक ही फ़ोल्डर में अपनी सीएसएस फाइलों में रहती हैं, लेकिन मैंने इसे मूल url(../someFile.png) ( url(../someFile.png) ) और बाल फ़ोल्डर्स ( url(someFolder/someFile.png ) के साथ परीक्षण किया है।

ट्रांसफॉर्म को निर्दिष्ट करना आवश्यक नहीं है या पागल उपनिर्देशिका पथ हैं। बहुत समस्या निवारण के बाद मैंने इसे इस "सरल" नियम को अलग किया (क्या यह एक बग है?) …

यदि आपकी बंडल पथ में शामिल किए जाने वाले आइटमों के सापेक्ष रूट के साथ शुरू नहीं होता है, तो वेब अनुप्रयोग जड़ को ध्यान में नहीं रखा जाएगा।

मुझे एक बग की तरह अधिक लगता है, लेकिन वैसे भी आप इसे वर्तमान .NET 4.51 संस्करण के साथ कैसे ठीक करते हैं। संभवत: पुराने एएसपी.नेट बिल्ड्स पर अन्य जवाब आवश्यक थे, यह नहीं कह सकते कि इन सबको पूर्वव्यापी परीक्षण करने का समय नहीं है।

स्पष्ट करने के लिए, यहां एक उदाहरण है:

मेरे पास ये फ़ाइलें हैं …

 ~/Content/Images/Backgrounds/Some_Background_Tile.gif ~/Content/Site.css - references the background image relatively, ie background: url('Images/...') 

फिर बंडल की तरह सेटअप …

 BundleTable.Add(new StyleBundle("~/Bundles/Styles").Include("~/Content/Site.css")); 

और इसे प्रस्तुत करना पसंद है …

 @Styles.Render("~/Bundles/Styles") 

और "व्यवहार" (बग) प्राप्त करें, सीएसएस फाइलें स्वयं आवेदन रूट (जैसे "http: // localhost: 1234 / mysite / content / site.css") हैं, लेकिन सीएसएस छवि सभी शुरूआत में "/ सामग्री / छवियाँ / … "या" / छवियाँ / … "इस पर निर्भर करता है कि क्या मैं रूपांतरण को बदलता हूं या नहीं।

यहां तक ​​कि "बंडल" फ़ोल्डर बनाने का प्रयास करने के लिए यह देखने के लिए कि क्या यह वर्तमान या नहीं के रास्ते से करना था, लेकिन उसने कुछ भी नहीं बदला समस्या का समाधान वास्तव में आवश्यकता है कि बंडल का नाम पथ रूट से शुरू होना चाहिए।

इस उदाहरण का मतलब बंडल मार्ग को पंजीकरण और रेंडर करके तय किया जाता है ..

 BundleTable.Add(new StyleBundle("~/Content/StylesBundle").Include("~/Content/Site.css")); ... @Styles.Render("~/Content/StylesBundle") 

अतः निश्चित रूप से आप यह कह सकते हैं कि आरटीएफएम है, लेकिन मुझे पूरा यकीन है कि मुझे और दूसरों ने डिफ़ॉल्ट टेम्पलेट से या "एमएसडीएन" या एएसपी.नेट वेब साइट पर कहीं और दस्तावेज में "~ / बंडल / …" मार्ग उठाया है, या बस उस पर ठोकर खाई क्योंकि वास्तव में यह एक आभासी पथ के लिए एक काफी तार्किक नाम है और इस तरह के आभासी पथ का चयन करने के लिए समझ में आता है जो वास्तविक निर्देशिकाओं के साथ संघर्ष नहीं करते हैं

वैसे भी, यह वह तरीका है माइक्रोसॉफ्ट कोई बग नहीं देखें मैं इसके साथ सहमत नहीं हूं, या तो यह अपेक्षा के अनुरूप काम करना चाहिए या कुछ अपवाद फेंक दिया जाना चाहिए, या बंडल पथ को जोड़ने के लिए एक अतिरिक्त ओवरराइड जो आवेदन रूट को शामिल करने के लिए चुना गया है या नहीं। मैं कल्पना नहीं कर सकता है कि कोई क्यों नहीं चाहता कि आवेदन जड़ में शामिल हो, जब कोई था (सामान्यतः जब तक कि आप अपनी वेब साइट को DNS उपनाम / डिफ़ॉल्ट वेब साइट रूट के साथ स्थापित न करें)। तो वास्तव में यह मूल रूप से डिफ़ॉल्ट होना चाहिए।

हालांकि क्रिस बैक्सटर का उत्तर मूल समस्या के साथ मदद करता है, यह मेरे मामले में तब काम नहीं करता जब आवेदन वर्चुअल निर्देशिका में होस्ट किया जाता है विकल्पों की जांच करने के बाद, मैंने DIY समाधान के साथ समाप्त किया

ProperStyleBundle कक्षा में मूल CssRewriteUrlTransform ट्रांसफॉर्मर से लिया गया कोड वर्चुअल निर्देशिका के भीतर सही तरीके से CssRewriteUrlTransform करने के लिए शामिल है। यह भी फेंकता है कि फाइल मौजूद नहीं है और बंडल में फ़ाइलों की BetterStyleBundle ( BetterStyleBundle से ली गई कोड) को BetterStyleBundle

 using System; using System.Collections.Generic; using System.IO; using System.Text.RegularExpressions; using System.Web; using System.Web.Optimization; using System.Linq; namespace MyNamespace { public class ProperStyleBundle : StyleBundle { public override IBundleOrderer Orderer { get { return new NonOrderingBundleOrderer(); } set { throw new Exception( "Unable to override Non-Ordered bundler" ); } } public ProperStyleBundle( string virtualPath ) : base( virtualPath ) {} public ProperStyleBundle( string virtualPath, string cdnPath ) : base( virtualPath, cdnPath ) {} public override Bundle Include( params string[] virtualPaths ) { foreach ( var virtualPath in virtualPaths ) { this.Include( virtualPath ); } return this; } public override Bundle Include( string virtualPath, params IItemTransform[] transforms ) { var realPath = System.Web.Hosting.HostingEnvironment.MapPath( virtualPath ); if( !File.Exists( realPath ) ) { throw new FileNotFoundException( "Virtual path not found: " + virtualPath ); } var trans = new List<IItemTransform>( transforms ).Union( new[] { new ProperCssRewriteUrlTransform( virtualPath ) } ).ToArray(); return base.Include( virtualPath, trans ); } // This provides files in the same order as they have been added. private class NonOrderingBundleOrderer : IBundleOrderer { public IEnumerable<BundleFile> OrderFiles( BundleContext context, IEnumerable<BundleFile> files ) { return files; } } private class ProperCssRewriteUrlTransform : IItemTransform { private readonly string _basePath; public ProperCssRewriteUrlTransform( string basePath ) { _basePath = basePath.EndsWith( "/" ) ? basePath : VirtualPathUtility.GetDirectory( basePath ); } public string Process( string includedVirtualPath, string input ) { if ( includedVirtualPath == null ) { throw new ArgumentNullException( "includedVirtualPath" ); } return ConvertUrlsToAbsolute( _basePath, input ); } private static string RebaseUrlToAbsolute( string baseUrl, string url ) { if ( string.IsNullOrWhiteSpace( url ) || string.IsNullOrWhiteSpace( baseUrl ) || url.StartsWith( "/", StringComparison.OrdinalIgnoreCase ) || url.StartsWith( "data:", StringComparison.OrdinalIgnoreCase ) ) { return url; } if ( !baseUrl.EndsWith( "/", StringComparison.OrdinalIgnoreCase ) ) { baseUrl = baseUrl + "/"; } return VirtualPathUtility.ToAbsolute( baseUrl + url ); } private static string ConvertUrlsToAbsolute( string baseUrl, string content ) { if ( string.IsNullOrWhiteSpace( content ) ) { return content; } return new Regex( "url\\(['\"]?(?<url>[^)]+?)['\"]?\\)" ) .Replace( content, ( match => "url(" + RebaseUrlToAbsolute( baseUrl, match.Groups["url"].Value ) + ")" ) ); } } } } 

इसे StyleBundle तरह प्रयोग करें:

 bundles.Add( new ProperStyleBundle( "~/styles/ui" ) .Include( "~/Content/Themes/cm_default/style.css" ) .Include( "~/Content/themes/custom-theme/jquery-ui-1.8.23.custom.css" ) .Include( "~/Content/DataTables-1.9.4/media/css/jquery.dataTables.css" ) .Include( "~/Content/DataTables-1.9.4/extras/TableTools/media/css/TableTools.css" ) ); 

मुझे पता चला कि यदि आप *.css फ़ाइल को संदर्भित कर रहे हैं और आपके पास एक ही फ़ोल्डर में संबंधित *.min.css फ़ाइल है, तो CssRewriteUrlTransform चलाने में विफल रहता है।

इसे ठीक करने के लिए, या तो *.min.css फ़ाइल को हटाएं या सीधे अपने बंडल में संदर्भ दें:

 bundles.Add(new Bundle("~/bundles/bootstrap") .Include("~/Libs/bootstrap3/css/bootstrap.min.css", new CssRewriteUrlTransform())); 

उसके बाद आप ऐसा करते हैं, आपके यूआरएल सही तरीके से परिवर्तित हो जाएंगे और आपकी छवियों को ठीक से हल किया जाना चाहिए।

शायद मैं पक्षपाती हूँ, लेकिन मुझे अपने समाधान की तरह पसंद है क्योंकि यह किसी भी परिवर्तन, रेगेक्स आदि नहीं करता है और इसके पास कम से कम कोड है 🙂

यह IIS वेब साइट में आभासी निर्देशिका के रूप में होस्ट की गई साइट के लिए और आईआईएस की रूट वेबसाइट के रूप में काम करता है

इसलिए मैंने IItemTransform के इम्प्लेन्टेशन को IItemTransform समझाया और पथ को ठीक करने और मौजूदा कोड को कॉल करने के लिए VirtualPathUtility का उपयोग किया:

 /// <summary> /// Is a wrapper class over CssRewriteUrlTransform to fix url's in css files for sites on IIS within Virutal Directories /// and sites at the Root level /// </summary> public class CssUrlTransformWrapper : IItemTransform { private readonly CssRewriteUrlTransform _cssRewriteUrlTransform; public CssUrlTransformWrapper() { _cssRewriteUrlTransform = new CssRewriteUrlTransform(); } public string Process(string includedVirtualPath, string input) { return _cssRewriteUrlTransform.Process("~" + VirtualPathUtility.ToAbsolute(includedVirtualPath), input); } } //App_Start.cs public static void Start() { BundleTable.Bundles.Add(new StyleBundle("~/bundles/fontawesome") .Include("~/content/font-awesome.css", new CssUrlTransformWrapper())); } 

मेरे लिए ठीक काम करने लगता है?

V1.1.0-अल्फा 1 (पूर्व रिलीज़ पैकेज) के रूप में, भौतिक फ़ाइल सिस्टम को छूने के बजाय VirtualPathProvider तक पहुंचने के लिए VirtualPathProvider के रूपरेखा का उपयोग करता है।

अद्यतन ट्रांसफार्मर नीचे देखा जा सकता है:

 public class StyleRelativePathTransform : IBundleTransform { public void Process(BundleContext context, BundleResponse response) { Regex pattern = new Regex(@"url\s*\(\s*([""']?)([^:)]+)\1\s*\)", RegexOptions.IgnoreCase); response.Content = string.Empty; // open each of the files foreach (var file in response.Files) { using (var reader = new StreamReader(file.Open())) { var contents = reader.ReadToEnd(); // apply the RegEx to the file (to change relative paths) var matches = pattern.Matches(contents); if (matches.Count > 0) { var directoryPath = VirtualPathUtility.GetDirectory(file.VirtualPath); foreach (Match match in matches) { // this is a path that is relative to the CSS file var imageRelativePath = match.Groups[2].Value; // get the image virtual path var imageVirtualPath = VirtualPathUtility.Combine(directoryPath, imageRelativePath); // convert the image virtual path to absolute var quote = match.Groups[1].Value; var replace = String.Format("url({0}{1}{0})", quote, VirtualPathUtility.ToAbsolute(imageVirtualPath)); contents = contents.Replace(match.Groups[0].Value, replace); } } // copy the result into the response. response.Content = String.Format("{0}\r\n{1}", response.Content, contents); } } } } 

यहाँ एक बंडल ट्रांसफ़ॉर्म है जो उस सीएसएस फाइल के सापेक्ष यूआरएल के साथ सीएसएस यूआरएल को बदल देगा। बस इसे अपने बंडल में जोड़ें और यह समस्या को ठीक करना चाहिए।

 public class CssUrlTransform: IBundleTransform { public void Process(BundleContext context, BundleResponse response) { Regex exp = new Regex(@"url\([^\)]+\)", RegexOptions.IgnoreCase | RegexOptions.Singleline); foreach (FileInfo css in response.Files) { string cssAppRelativePath = css.FullName.Replace(context.HttpContext.Request.PhysicalApplicationPath, context.HttpContext.Request.ApplicationPath).Replace(Path.DirectorySeparatorChar, '/'); string cssDir = cssAppRelativePath.Substring(0, cssAppRelativePath.LastIndexOf('/')); response.Content = exp.Replace(response.Content, m => TransformUrl(m, cssDir)); } } private string TransformUrl(Match match, string cssDir) { string url = match.Value.Substring(4, match.Length - 5).Trim('\'', '"'); if (url.StartsWith("http://") || url.StartsWith("data:image")) return match.Value; if (!url.StartsWith("/")) url = string.Format("{0}/{1}", cssDir, url); return string.Format("url({0})", url); } } 

भौतिक छवि फ़ोल्डर में आभासी बंडल छवि फ़ोल्डर को मैप करने के लिए IIS यूआरएल रीराइट मॉड्यूल का एक अन्य विकल्प होगा। नीचे एक फिर से लिखना नियम का एक उदाहरण है, जिसे आप "~ / bundles / yourpage / styles" नामक एक बंडल के लिए उपयोग कर सकते हैं – ध्यान दें कि अक्षरों के वर्णों के साथ ही हाइफ़न, अंडरस्कोर और अवधि, जो छवि फ़ाइल नामों में सामान्य हैं ।

 <rewrite> <rules> <rule name="Bundle Images"> <match url="^bundles/yourpage/images/([a-zA-Z0-9\-_.]+)" /> <action type="Rewrite" url="Content/css/jquery-ui/images/{R:1}" /> </rule> </rules> </rewrite> 

यह दृष्टिकोण थोड़ा अतिरिक्त ओवरहेड बनाता है, लेकिन आपको अपने बंडल के नाम पर अधिक नियंत्रण करने की सुविधा प्रदान करता है, और आपको एक पृष्ठ पर बंडलों की संख्या भी कम कर सकती है। बेशक, यदि आपको कई तृतीय पक्ष सीएसएस फ़ाइलों को संदर्भित करना है, जिसमें रिश्तेदार छवि पथ संदर्भ होते हैं, तो आप अभी भी कई बंडल बनाने के आसपास नहीं जा सकते।

ग्रिन समाधान महान है

हालांकि यह मेरे लिए काम नहीं करता है जब यूआरएल में मूल फ़ोल्डर रिलेक्टिव संदर्भ होते हैं। यानी url('../../images/car.png')

इसलिए, मैंने प्रत्येक रीजक्स मैच के लिए पथों को हल करने के लिए, सापेक्ष पथ की अनुमति देने और वैकल्पिक रूप से सीएसएस में छवियों को एम्बेड करने के लिए Include विधि को थोड़ा बदल दिया।

मैंने BundleTable.EnableOptimizations जांच करने के लिए IF DEBUG को भी बदल दिया है। HttpContext.Current.IsDebuggingEnabled बजाय BundleTable.EnableOptimizations

  public new Bundle Include(params string[] virtualPaths) { if (!BundleTable.EnableOptimizations) { // Debugging. Bundling will not occur so act normal and no one gets hurt. base.Include(virtualPaths.ToArray()); return this; } var bundlePaths = new List<string>(); var server = HttpContext.Current.Server; var pattern = new Regex(@"url\s*\(\s*([""']?)([^:)]+)\1\s*\)", RegexOptions.IgnoreCase); foreach (var path in virtualPaths) { var contents = File.ReadAllText(server.MapPath(path)); var matches = pattern.Matches(contents); // Ignore the file if no matches if (matches.Count == 0) { bundlePaths.Add(path); continue; } var bundlePath = (System.IO.Path.GetDirectoryName(path) ?? string.Empty).Replace(@"\", "/") + "/"; var bundleUrlPath = VirtualPathUtility.ToAbsolute(bundlePath); var bundleFilePath = string.Format("{0}{1}.bundle{2}", bundlePath, System.IO.Path.GetFileNameWithoutExtension(path), System.IO.Path.GetExtension(path)); // Transform the url (works with relative path to parent folder "../") contents = pattern.Replace(contents, m => { var relativeUrl = m.Groups[2].Value; var urlReplace = GetUrlReplace(bundleUrlPath, relativeUrl, server); return string.Format("url({0}{1}{0})", m.Groups[1].Value, urlReplace); }); File.WriteAllText(server.MapPath(bundleFilePath), contents); bundlePaths.Add(bundleFilePath); } base.Include(bundlePaths.ToArray()); return this; } private string GetUrlReplace(string bundleUrlPath, string relativeUrl, HttpServerUtility server) { // Return the absolute uri Uri baseUri = new Uri("http://dummy.org"); var absoluteUrl = new Uri(new Uri(baseUri, bundleUrlPath), relativeUrl).AbsolutePath; var localPath = server.MapPath(absoluteUrl); if (IsEmbedEnabled && File.Exists(localPath)) { var fi = new FileInfo(localPath); if (fi.Length < 0x4000) { // Embed the image in uri string contentType = GetContentType(fi.Extension); if (null != contentType) { var base64 = Convert.ToBase64String(File.ReadAllBytes(localPath)); // Return the serialized image return string.Format("data:{0};base64,{1}", contentType, base64); } } } // Return the absolute uri return absoluteUrl; } 

आशा है कि यह मदद करता है, का संबंध है।

आप बस अपने वर्चुअल बंडल पथ पर गहराई का दूसरा स्तर जोड़ सकते हैं

  //Two levels deep bundle path so that paths are maintained after minification bundles.Add(new StyleBundle("~/Content/css/css").Include("~/Content/bootstrap/bootstrap.css", "~/Content/site.css")); 

यह एक सुपर कम तकनीक का उत्तर और एक तरह का हैक है लेकिन यह काम करता है और किसी पूर्व प्रसंस्करण की आवश्यकता नहीं होगी। इन उत्तरों में से कुछ की लंबाई और जटिलता को देखते हुए, मैं इसे इस तरह से करना पसंद करता हूं।

मेरे पास इस समस्या को बंडल के साथ चित्रों में गलत पथ है और CssRewriteUrlTransform संबंध में सापेक्ष अभिभावक पथ को हल नहीं किया गया है .. ठीक है (बाहरी संसाधन जैसे CssRewriteUrlTransform साथ भी समस्या थी) यही कारण है कि मैंने यह कस्टम परिवर्तन लिखा था (ऊपर की सभी सही तरीके से करने के लिए प्रतीत होता है):

 public class CssRewriteUrlTransform2 : IItemTransform { public string Process(string includedVirtualPath, string input) { var pathParts = includedVirtualPath.Replace("~/", "/").Split('/'); pathParts = pathParts.Take(pathParts.Count() - 1).ToArray(); return Regex.Replace ( input, @"(url\(['""]?)((?:\/??\.\.)*)(.*?)(['""]?\))", m => { // Somehow assigning this to a variable is faster than directly returning the output var output = ( // Check if it's an aboslute url or base64 m.Groups[3].Value.IndexOf(':') == -1 ? ( m.Groups[1].Value + ( ( ( m.Groups[2].Value.Length > 0 || !m.Groups[3].Value.StartsWith('/') ) ) ? string.Join("/", pathParts.Take(pathParts.Count() - m.Groups[2].Value.Count(".."))) : "" ) + (!m.Groups[3].Value.StartsWith('/') ? "/" + m.Groups[3].Value : m.Groups[3].Value) + m.Groups[4].Value ) : m.Groups[0].Value ); return output; } ); } } 

संपादित करें: मुझे इसका एहसास नहीं हुआ, लेकिन मैंने कोड में कुछ कस्टम एक्सटेंशन विधियों का इस्तेमाल किया इनमें स्रोत कोड है:

 /// <summary> /// Based on: http://stackoverflow.com/a/11773674 /// </summary> public static int Count(this string source, string substring) { int count = 0, n = 0; while ((n = source.IndexOf(substring, n, StringComparison.InvariantCulture)) != -1) { n += substring.Length; ++count; } return count; } public static bool StartsWith(this string source, char value) { if (source.Length == 0) { return false; } return source[0] == value; } 

बेशक, String.StartsWith(char) को String.StartsWith(string) साथ बदलना संभव है।

थोड़ी जांच के बाद मैंने निष्कर्ष निकाला: आपके पास 2 विकल्प हैं:

  1. परिवर्तनों के साथ जाओ इसके लिए बहुत उपयोगी पैकेज: https://bundletransformer.codeplex.com/ आपको हर समस्याग्रस्त बंडल के लिए परिवर्तन की आवश्यकता है:

     BundleResolver.Current = new CustomBundleResolver(); var cssTransformer = new StyleTransformer(); standardCssBundle.Transforms.Add(cssTransformer); bundles.Add(standardCssBundle); 

Advantages: of this solution, you can name your bundle whatever you want => you can combine css files into one bundle from different directories. Disadvantages: You need to transform every problematic bundle

  1. Use the same relative root for the name of the bundle like where the css file is located. Advantages: there is no need for transformation. Disadvantages: You have limitation on combining css sheets from different directories into one bundle.

CssRewriteUrlTransform fixed my problem.
If your code still not loading images after using CssRewriteUrlTransform , then change your css filename's from:

 .Include("~/Content/jquery/jquery-ui-1.10.3.custom.css", new CssRewriteUrlTransform()) 

सेवा मेरे:

 .Include("~/Content/jquery/jquery-ui.css", new CssRewriteUrlTransform()) 

Someway .(dots) are not recognizing in url.