Почему мой CSS-пакет не работает с развернутым приложением MVC4 bin?

обновление 11/4/2013:

причина, почему это происходит потому, что у вас есть .js или .css в конце вашего имени пакета, который вызывает ASP.NET чтобы не запускать запрос через MVC и BundleModule.

рекомендуемый способ исправить это для лучшей производительности удалить .js или .css от вашего имени пакета.

Так / bundle / myscripts.js будет / bundle / myscripts

в качестве альтернативы вы можете изменить свой веб.конфигурация в

просто чтобы прояснить несколько вещей, System.Web.Optimization (aka Bundling/Minification) будет работать против 4.0. Это не зависит ни от чего в 4.5, поэтому там не должно быть никаких проблем.

если связывание сценариев работает, и это только проблема с CSS, возможно, проблема связана с относительными URL-адресами?

Я бы сначала посмотрел на визуализированную страницу и посмотрел, получаете ли вы ссылки на пакет CSS, т. е. что-то вроде:

<link href="/app/Content/css?v=oI5uNwN5NWmYrn8EXEybCI" rel="stylesheet"/>

если вы, то связывание работает, но что-то внутри вашего пакета CSS перепутано. Обычно это связано с тем, что относительные URL-адреса внутри вашего пакета CSS неверны, т. е. если ваши изображения живут под ~/Content, но вы называете свой пакет ~/bundles/css браузер будет неправильно искать изображения под ~/bundles.

кроме того, поведение по умолчанию-отключить связывание и минимизацию, когда debug=true. Итак, если вы хотите, чтобы оптимизация была включена, даже когда debug=true, вам необходимо сила:

BundleTable.EnableOptimizations = true

обновление: С новой информацией, что v="", это означает, что пакет был пуст, вы должны проверить, что вы добавляете файлы в пакет правильно, и что он нашел их. Как вы включаете файлы в пакет?

опущение runAllManagedModulesForAllRequests="true" также работал для меня. Добавьте следующую конфигурацию в web.config:

<modules>
  <remove name="BundleModule" />
  <add name="BundleModule" type="System.Web.Optimization.BundleModule" />
</modules>

runAllManagedModulesForAllRequests наложит хит производительности на ваш сайт, если он не используется должным образом. Проверьте в этой статье.

другое дело, что ссылки не могут иметь одно и то же имя. Например, если у вас есть пользовательский интерфейс jQuery в libraries каталог, и пакет его JavaScript-файл, как так:

bundles.Add(new ScriptBundle("~/libraries").Include("~/libraries/jquery-ui/jqyery-ui.js"));

а затем попробуйте связать его CSS-файлы следующим образом:

bundles.Add(new StyleBundle("~/libraries").Include("~/libraries/jquery-ui/jqyery-ui.css"));
...

это не удастся. Они должны иметь уникальные имена. Так что сделайте что-то вроде ScriptBundle("~/libraries/js")... и ScriptBundle("~/libraries/css")... или что-то еще.

в качестве дополнения к существующим ответам, ни один из которых не работал для меня, я нашел свое решение здесь:

https://bundletransformer.codeplex.com/discussions/429707

было принято решение

1. щелкните правой кнопкой мыши .меньше файлов в visual studio
2. выберите Свойства
3. Марк Build Action Как Content
4. перевести

мне не нужно было удалять обработчики без расширения (как можно найти в других решениях в интернете)

мне не пришлось добавлять <add name="BundleModule" type="System.Web.Optimization.BundleModule" /> web.конфигурации.

надеюсь, что это помогает!

Я столкнулся с той же проблемой с CSS в живой среде. Я следовал всем советам здесь и исследовал, как связывание работает за сценой. Это заставило меня запросить, чтобы кэш .Net был очищен (у меня не было доступа к серверам приложений), что привело к тому, что пакет начал работать на серверах приложений. Однако при доступе к сайту через балансировщик нагрузки с настроенным CDN, хотя идентификатор пакета был обновлен в url-адресе, пакет содержал старый CSS. Просто промывка CDN решила проблему.

Я надеюсь, что это идет каким-то образом, чтобы помочь кому-то еще, кто может столкнуться с этим

один из моих файлов css имел символ ' _ ' в имени файла, который вызвал проблемы.

переименовал your_style.css для вашего стиля.css

просто для истории:

проверьте, что все упомянутые файлы less/css в пакете имеют действие сборки = "Content".

нет ошибки, если некоторые файлы из пакета отсутствуют на целевом сервере.

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

я столкнулся с этой проблемой при развертывании кода на веб-сайтах Azure. это действительно сработало, когда я развернул сборку visualstudio.com и не было, когда я пытался опубликовать сборку из visual studio 2013. основной проблемой была минимизация CSS. Я полностью согласен с 1-м ответом на этот вопрос. но мысль о совместном решении, которое сработало для меня, может быть, это поможет вам в его исправлении.

в основном, когда мы развертываем через VSO он генерирует файлы минификации для css, js, пиная в системе.сеть.Оптимизация,но когда мы публикуем сборку из VS 2013, мы должны позаботиться о следующем. пакетирование и минификация 1. убедитесь, что структура папок и соглашение об именовании пакетов должны отличаться. что-то вроде этого.

bundles.Add(new StyleBundle("~/Content/materialize/mcss").Include(
                  "~/Content//materialize/css/materialize.css"));

2. добавить в нижней части определения bundleconfig

public static void RegisterBundles(BundleCollection bundles)
{
  bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
             "~/Scripts/jquery-{version}.js"));

   // Code removed for clarity.
   BundleTable.EnableOptimizations = true;
}

3. обязательно добавьте debug false в web.config (когда вы начинаете локальную отладку VS2013 даст вам всплывающее сообщение о том, что вам нужно убедитесь в том, чтобы положить его обратно перед развертыванием в prod. это само по себе многое объясняет.

<system.web>
  <compilation debug="true" />
  <!-- Lines removed for clarity. -->
</system.web>

С Visual Studio 2015 я обнаружил, что проблема была вызвана ссылкой .минимальная версия файла javascript в BundleConfig, когда debug=true установлен в интернете.конфиг.

например, с jquery, указывающим следующее В BundleConfig:

bundles.Add(new ScriptBundle("~/bundles/jquery").Include("~/Scripts/jquery-{version}.min.js"));

в результате jquery не загружается правильно вообще, когда debug=true был установлен в интернете.конфиг.

ссылка на ООН-минимизированная версия:

bundles.Add(new ScriptBundle("~/bundles/jquery").Include("~/Scripts/jquery-{version}.js"));

исправляет проблема.

установка debug=false также исправляет проблему, но, конечно, это не совсем полезно.

также стоит отметить, что в то время как некоторые уменьшенные файлы javascript загружались правильно, а другие нет. Я закончил тем, что удалил все уменьшенные файлы javascript в пользу vs handling minification для меня.

попробуйте это:

    @System.Web.Optimization.Styles.Render("~/Content/css")
    @System.Web.Optimization.Scripts.Render("~/bundles/modernizr")

это сработало для меня. Я все еще учусь, и я еще не понял, почему это происходит

чтобы добавить полезную информацию в разговор, я столкнулся с 404 ошибками для моих пакетов в развертывании (это было нормально в локальной среде разработки).

для имен пакетов я включаю номера версий, такие как:

bundles.Add(new ScriptBundle("~/bundles/jquerymobile.1.4.3").Include(
...
);

по прихоти, я удалил все точки и все снова работало волшебно:

bundles.Add(new ScriptBundle("~/bundles/jquerymobile143").Include(
...
);

надеюсь, что поможет кому-то сэкономить время и нервы.

у меня была эта проблема при добавлении некоторых пакетов из nuget и забыл сделать обновление

поэтому сначала сделайте обновление всех пакетов, установленных в проекте

Update-Package

в глобальном масштабе.асакс.в CS добавьте следующий элемент

BundleTable.EnableOptimizations = true;

имена css должны быть согласованы.

имена jQueryUI css не являются " jquery.пользовательский интерфейс.XXX " в папке Contents/themes/base .

так и должно быть :

неправильно:

            bundles.Add(new StyleBundle("~/Content/themes/base/css").Include(
                                    "~/Content/themes/base/jquery.ui.core.css",
                                    "~/Content/themes/base/jquery.ui.resizable.css",
                                    "~/Content/themes/base/jquery.ui.selectable.css",
                                    "~/Content/themes/base/jquery.ui.accordion.css",
                                    "~/Content/themes/base/jquery.ui.autocomplete.css",
                                    "~/Content/themes/base/jquery.ui.button.css",
                                    "~/Content/themes/base/jquery.ui.dialog.css",
                                    "~/Content/themes/base/jquery.ui.slider.css",
                                    "~/Content/themes/base/jquery.ui.tabs.css",
                                    "~/Content/themes/base/jquery.ui.datepicker.css",
                                    "~/Content/themes/base/jquery.ui.progressbar.css",
                                    "~/Content/themes/base/jquery.ui.theme.css"));

правильно :

            bundles.Add(new StyleBundle("~/Bundles/themes/base/css").Include(
                                    "~/Content/themes/base/core.css",
                                    "~/Content/themes/base/resizable.css",
                                    "~/Content/themes/base/selectable.css",
                                    "~/Content/themes/base/accordion.css",
                                    "~/Content/themes/base/autocomplete.css",
                                    "~/Content/themes/base/button.css",
                                    "~/Content/themes/base/dialog.css",
                                    "~/Content/themes/base/slider.css",
                                    "~/Content/themes/base/tabs.css",
                                    "~/Content/themes/base/datepicker.css",
                                    "~/Content/themes/base/progressbar.css",
                                    "~/Content/themes/base/theme.css"));

Я пробовал в MVC5 и работал успешно.

вы должны добавить этот код в общий вид

 @*@Scripts.Render("~/bundles/plugins")*@
    <script src="/Content/plugins/jQuery/jQuery-2.1.4.min.js"></script>
    <!-- jQuery UI 1.11.4 -->
    <script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
    <!-- Kendo JS -->
    <script src="/Content/kendo/js/kendo.all.min.js" type="text/javascript"></script>
    <script src="/Content/kendo/js/kendo.web.min.js" type="text/javascript"></script>
    <script src="/Content/kendo/js/kendo.aspnetmvc.min.js"></script>
    <!-- Bootstrap 3.3.5 -->
    <script src="/Content/bootstrap/js/bootstrap.min.js"></script>
    <!-- Morris.js charts -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js"></script>
    <script src="/Content/plugins/morris/morris.min.js"></script>
    <!-- Sparkline -->
    <script src="/Content/plugins/sparkline/jquery.sparkline.min.js"></script>
    <!-- jvectormap -->
    <script src="/Content/plugins/jvectormap/jquery-jvectormap-1.2.2.min.js"></script>
    <script src="/Content/plugins/jvectormap/jquery-jvectormap-world-mill-en.js"></script>
    <!-- jQuery Knob Chart -->
    <script src="/Content/plugins/knob/jquery.knob.js"></script>
    <!-- daterangepicker -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.2/moment.min.js"></script>
    <script src="/Content/plugins/daterangepicker/daterangepicker.js"></script>
    <!-- datepicker -->
    <script src="/Content/plugins/datepicker/bootstrap-datepicker.js"></script>
    <!-- Bootstrap WYSIHTML5 -->
    <script src="/Content/plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js"></script>
    <!-- Slimscroll -->
    <script src="/Content/plugins/slimScroll/jquery.slimscroll.min.js"></script>
    <!-- FastClick -->
    <script src="/Content/plugins/fastclick/fastclick.min.js"></script>
    <!-- AdminLTE App -->
    <script src="/Content/dist/js/app.min.js"></script>
    <!-- AdminLTE for demo purposes -->
    <script src="/Content/dist/js/demo.js"></script>
    <!-- Common -->
    <script src="/Scripts/common/common.js"></script>
    <!-- Render Sections -->
    @RenderSection("scripts", required: false)
    @RenderSection("HeaderSection", required: false)

это решило мою проблему. Я добавил Эти строки в _Layout.cshtml

@*@Scripts.Render("~/bundles/plugins")*@
<script src="/Content/plugins/jQuery/jQuery-2.1.4.min.js"></script>
<!-- jQuery UI 1.11.4 -->
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
<!-- Kendo JS -->
<script src="/Content/kendo/js/kendo.all.min.js" type="text/javascript"></script>
<script src="/Content/kendo/js/kendo.web.min.js" type="text/javascript"></script>
<script src="/Content/kendo/js/kendo.aspnetmvc.min.js"></script>
<!-- Bootstrap 3.3.5 -->
<script src="/Content/bootstrap/js/bootstrap.min.js"></script>
<!-- Morris.js charts -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js"></script>
<script src="/Content/plugins/morris/morris.min.js"></script>
<!-- Sparkline -->
<script src="/Content/plugins/sparkline/jquery.sparkline.min.js"></script>
<!-- jvectormap -->
<script src="/Content/plugins/jvectormap/jquery-jvectormap-1.2.2.min.js"></script>
<script src="/Content/plugins/jvectormap/jquery-jvectormap-world-mill-en.js"></script>
<!-- jQuery Knob Chart -->
<script src="/Content/plugins/knob/jquery.knob.js"></script>
<!-- daterangepicker -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.2/moment.min.js"></script>
<script src="/Content/plugins/daterangepicker/daterangepicker.js"></script>
<!-- datepicker -->
<script src="/Content/plugins/datepicker/bootstrap-datepicker.js"></script>
<!-- Bootstrap WYSIHTML5 -->
<script src="/Content/plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js"></script>
<!-- Slimscroll -->
<script src="/Content/plugins/slimScroll/jquery.slimscroll.min.js"></script>
<!-- FastClick -->
<script src="/Content/plugins/fastclick/fastclick.min.js"></script>
<!-- AdminLTE App -->
<script src="/Content/dist/js/app.min.js"></script>
<!-- AdminLTE for demo purposes -->
<script src="/Content/dist/js/demo.js"></script>
<!-- Common -->
<script src="/Scripts/common/common.js"></script>
<!-- Render Sections -->

у меня была та же проблема . я просто конвертирую

@Styles.Render("~/Content/css")
and @Scripts.Render("~/bundles/modernizr") to 
    @Styles.Render("/Content/css")
    @Scripts.Render("/bundles/modernizr")

и работал. просто не забудьте конвертировать

   @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/bootstrap")
to 
    @Scripts.Render("/bundles/jquery")
    @Scripts.Render("/bundles/bootstrap")

приятно провести время