Пошаговое исправление (минификация не удалась.

Привет Народ 👋,

Что такое объединение и минификация? 🤔

Методы связывания и минимизации были введены в MVC 4 для сокращения времени загрузки запросов. Объединение позволяет нам загружать кучу статических файлов с сервера в одном HTTP-запросе.

На следующем рисунке показана техника связывания:

Поскольку мы обычно сталкиваемся с этой проблемой в пакетах CSS, мы пытаемся отладить код стиля в файлах CSS, но ничего не найдено, чтобы исправить это, мы создаем BundleMinificationUtility, которая является консольным приложением.

Вот файл конфигурации JSON.

CssBundleConfig.json

{
  "css": [
    {
      "destinationpath": "../css/home-bundled.css",
      "files": [
        "../css/bootstrap-4.2.1.min.css",
        "../all.css",
        "../css/style.css"
      ]
    },
    {
      "destinationpath": "../css/header-bundled.css",
      "files": [
        "../css/toastr.min.css",
        "../css/Typeahead.min.css"
      ]
    }
  ]
}

Программа.cs

using Newtonsoft.Json;
using NUglify;
using System;
using System.Collections.Generic;
using System.Configuration;
using System.IO;
static void Main(string[] args) {
  #region Extracting the files
  string cssFileName = ConfigurationManager.AppSettings["cssBundleConfig"];
  #endregion
  result = File.ReadAllText(cssFileName);
  ExtractCssFile(result);
}

static void ExtractCssFile(string fileJson) {
  try {
    CssBundleConfigEntity obj = JsonConvert.DeserializeObject < CssBundleConfigEntity > (fileJson);
    if (obj.css.Count > 0) {
      foreach(var e in obj.css) {
        string destinationFilePath = e.destinationpath;
        File.WriteAllText(destinationFilePath, string.Empty);
        foreach(var file in e.files) {
          AppendCSSFile(file, destinationFilePath);
        }
      }
    }
  } catch {}
}
static void AppendCSSFile(string file, string destinationFilePath) {
try {
string fileName = "/* " + Path.GetFileName(file) + " */";
    File.AppendAllText(destinationFilePath, fileName);
    File.AppendAllText(destinationFilePath, Environment.NewLine);
    var fileText = File.ReadAllText(file);
var minifiedFileText = Uglify.Css(fileText);
File.AppendAllText(destinationFilePath, minifiedFileText.ToString());
    File.AppendAllText(destinationFilePath, Environment.NewLine);
  } catch {
}
}

Это консольное приложение создаст новые связанные файлы по пути назначения, который мы определили в файле CssBundleConfig.json.

Теперь запустите консольное приложение BundleMinificationUtility из события после сборки проекта ASP.NET MVC. 🔥🎯

Перед вызовом нового упакованного мини-файла в View .csHTML давайте просто настроим совместимость включения и отключения минимизации, поскольку у нас есть функция включения/отключения оптимизации минимизации в файле Bundle.config в ASP.NET MVC.

Создайте CustomRenderStyle (пользовательский помощник Html), который будет возвращать IHtmlString в соответствии с конфигурацией текущего проекта ASP.NET MVC. 🔥

CustomBundle.cs

public class CustomBundle {
    
  static string varEnableBundleOptimization = ConfigurationManager.AppSettings["EnableBundlingMinification"];
  public static IHtmlString RenderStyle(string path) {
    try {
      string strHost = HttpContext.Current.Request.Url.OriginalString;
      string jsFileName = strHost + "UtilityBundleMinification/CssBundleConfig.json";
using(WebClient client = new WebClient()) {
        Stream stream = client.OpenRead(jsFileName);
        string result = new StreamReader(stream).ReadToEnd();
        return MvcHtmlString.Create(ExtractCssFile(result, path));
      }
} catch {
}
    path = "<link href='" + path + "' type='text/css' rel='stylesheet' />";
    return MvcHtmlString.Create(path);
  }
  
  
  static string ExtractCssFile(string fileJson, string path) {
    string link = string.Empty;
    try {
if (varEnableBundleOptimization.Equals("1")) {
        link += "<link href='" + path + "' type='text/css' rel='stylesheet' />";
return link;
      }
      CssFilePathEntity obj = JsonConvert.DeserializeObject < CssFilePathEntity > (fileJson);
      if (obj.css.Count > 0) {
        string searchedString = SearchFilePath(path, "css/");
var file = obj.css.Where(x => SearchFilePath(x.destinationpath, "Content/") == searchedString).FirstOrDefault();
foreach(var e in file.files) {
link += "<link href='" + BASEPATH + e.Replace("../", "/") + "' type='text/css' rel='stylesheet' />";
          link += Environment.NewLine;
        }
      }
} catch (Exception ex) {
}
return link;
  }
}
public static string SearchFilePath(string ActualString, string ToSearch) {
  int ix = ActualString.IndexOf(ToSearch);
if (ix != -1) {
    return ActualString.Substring(ix + ToSearch.Length);
}
  return "";
}

Если для параметра EnableBundlingMinification задано значение false, будут добавлены файлы, являющиеся дочерними элементами объекта destinationPath.

Теперь вызывается метод RenderStyle CustomBundle.cs (Custom Html Helper) в представлении Razor. ✅😃

HomeView.csHtml

@CustomBundle.RenderStyle("home-bundled.css") // destinationPath file from CssBundleConfig.css
@CustomBundle.RenderStyle("header-bundled.css") // destinationPath file from CssBundleConfig.css

Бум, ошибка минимизации была устранена, и новые связанные файлы были минимизированы. 🥳🎉🕺🏼

Та же стратегия, которую вы можете использовать для пакета и минимизации Javascript.

Вот и все, удачного кодинга ☺️.