Объединение файлов в разные каталоги?

Question

Недавно я столкнулся с проблемой на веб-сайте, где стиль на странице был действительно испорчен, но только в IE. Мой босс сказал мне, что, скорее всего, это потому, что созданный CSS-пакет содержит файлы CSS из разных каталогов, поэтому я проверил и сделал это. Это было похоже на ниже:

bundles.Add(new StyleBundle("~/path/subpath/all").Include(
       "~/path/subpath/filename.css", 
       "~/path/subpath/filename1.css", 
       "~/path/subpath/filename2.css", 
       "~/path/subpath/filename3.css", 
       "~/path/subpath/anotherSubPath/filename.css", 
       "~/path/subpath/anotherSubPath/filename1.css", 
       "~/path/aDifferentSubPath/filename.css")); 

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

bundles.Add(new StyleBundle("~/path/subpath/all").Include(
      "~/path/subpath/filename.css", 
      "~/path/subpath/filename1.css", 
      "~/path/subpath/filename2.css", 
      "~/path/subpath/filename3.css")); 

bundles.Add(new StyleBundle("~/path/subpath/anotherSubPath/all").Include(
      "~/path/subpath/anotherSubPath/filename.css", 
      "~/path/subpath/anotherSubPath/filename1.css")); 

bundles.Add(new StyleBundle("~/path/aDifferentSubPath/all").Include(
      "~/path/aDifferentSubPath/filename.css")); 

Это работало и исправляло нашу проблему в IE. Хорошо, так что теперь на мои вопросы:

• Был ли мой босс правильным? Можете ли вы не связывать файлы из разных папок?
• Если бы он был прав, зачем это только ломаться в IE? И почему вы должны только Bundle файлы из того же каталога?
• Если он не был прав, что могло быть проблемой? И почему бы расщепить связку?

Answer 1

Для более старых версий IE, по крайней мере, 10 < есть некоторые известные ограничения

Количество CSS и файлы сценарии IE могут загрузить - это может быть проблема, если вы используете сайт в Debug где пакеты не попадают в комплект.

Если это не так, то у вас есть более 4096 селекторов в файле ???

Internet Explorer CSS limits

Answer 2

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

Например у вас есть:

bundles.Add(new StyleBundle("~/path/subpath/all").Include(
      ... 
      "~/path/subpath/anotherSubPath/filename1.css")); 

и в вашем filename1.css вы используете background: url(image.jpg) и обычно это изображение находится в той же папке, что и filename1.css, что ~/path/subpath/anotherSubPath/image.jpg. Используя пакеты, как показано ниже, браузер ищет несуществующий файл ~/path/subpath/all/image.jpg. Возможно, это причина разделения пучков.

Answer 3

Ваш босс звучит потрясающе! Во-первых, для CSS-путей относительно файла CSS, поэтому я подозреваю, поэтому он посоветовал вам изменить это в любом случае.

Но длина CSS также может быть проблемой, и, вероятно, это была основная причина в этом случае.

К сожалению, в браузерах есть несколько особенностей, таких как этот CSS-код или размеры изображений на устройствах Apple (которые раньше встречались с листами спрайтов). Вы, босс, похожи на динамичный, включенный парень, который знал бы это.