67 votes

Pourquoi mon regroupement CSS ne fonctionne-t-il pas avec une application MVC4 déployée par bin?

J'ai bin déployé un MVC4 demande à mon fournisseur d'hébergement, d'après les conseils donnés ici et un ou deux sur la volée de bugs, mais le plus immédiatement apparente problème est que le groupement pour le css ne fonctionne pas. Quand j'ai remplacer le faisceau réf explicite de fichier refs, mon css fonctionne à nouveau.

Je suis à l'aide d'un MVC4 RTM modèle de projet de VS2012. Le fournisseur s'exécute IIS 7.5 et ASP.NET 4, et ma MVC3 version de la même application a bien fonctionné. Je devine que j'ai attrapé une dépendance de quelque part de trop bas une version, et cela pourrait aussi contribuer à mon domaine d'action basé sur le lien de problème.

Technique symptômes sont les suivants:

La ligne @Styles.Render("~/Content/css") rendu sous la forme d' <link href="http://stackoverflow.com/Content/css?v=" rel="stylesheet"/>

82voto

CDeutsch Points 1643

Mise à JOUR 11/4/2013:

La raison pour laquelle cela se produit est que vous les avez .js ou .css à la fin de votre nom de bundle qui provoque ASP.NET pour ne pas exécuter de la demande par le biais de MVC et le BundleModule.

Le moyen recommandé pour corriger pour une meilleure performance est de supprimer la .js ou .css de votre nom de bundle.

Donc /bundle/myscrips.js devient /bundle/myscripts

Alternativement, vous pouvez modifier votre site web.config dans le système.le serveur web de la section de l'exécution de ces demandes par le biais de la BundleModule (qui a été ma réponse originale à cette question)

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

Edit: j'ai aussi remarqué que si le nom se termine par 'css' (sans le point), qui est un problème. J'ai dû changer mon nom de bundle à partir de 'DataTablesCSS' à 'DataTablesStyles" pour résoudre mon problème.

79voto

Yarx Points 5999

Le CSS et le Script regroupement devrait fonctionner, peu importe si .NET est en cours d'exécution 4.0 ou 4.5. Je suis en cours d'exécution .NET 4.0 et il fonctionne très bien pour moi. Toutefois, dans le but d'obtenir la minification et le groupement de comportement de travailler à votre site web.config doit être réglé pour ne pas être en cours d'exécution en mode debug.

<compilation debug="false" targetFramework="4.0">

Prendre ce bundle pour jQuery UI exemple dans le _Layout.cshtml fichier.

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

Si je lance avec debug="true" - je obtenir le code HTML suivant.

<link href="http://stackoverflow.com/Content/themes/base/jquery.ui.core.css" rel="stylesheet"/>
<link href="http://stackoverflow.com/Content/themes/base/jquery.ui.resizable.css" rel="stylesheet"/>
<link href="http://stackoverflow.com/Content/themes/base/jquery.ui.selectable.css" rel="stylesheet"/>
<link href="http://stackoverflow.com/Content/themes/base/jquery.ui.accordion.css" rel="stylesheet"/>
<link href="http://stackoverflow.com/Content/themes/base/jquery.ui.autocomplete.css" rel="stylesheet"/>
<link href="http://stackoverflow.com/Content/themes/base/jquery.ui.button.css" rel="stylesheet"/>
<link href="http://stackoverflow.com/Content/themes/base/jquery.ui.dialog.css" rel="stylesheet"/>
<link href="http://stackoverflow.com/Content/themes/base/jquery.ui.slider.css" rel="stylesheet"/>
<link href="http://stackoverflow.com/Content/themes/base/jquery.ui.tabs.css" rel="stylesheet"/>
<link href="http://stackoverflow.com/Content/themes/base/jquery.ui.datepicker.css" rel="stylesheet"/>
<link href="http://stackoverflow.com/Content/themes/base/jquery.ui.progressbar.css" rel="stylesheet"/>
<link href="http://stackoverflow.com/Content/themes/base/jquery.ui.theme.css" rel="stylesheet"/>

Mais si je lance avec debug="false". Je vais prendre cela à la place.

<link href="http://stackoverflow.com/Content/themes/base/css?v=myqT7npwmF2ABsuSaHqt8SCvK8UFWpRv7T4M8r3kiK01" rel="stylesheet"/>

C'est une fonctionnalité de sorte que vous pouvez résoudre facilement des problèmes avec votre Script et les fichiers CSS. Je suis à l'aide de la MVC4 RTM.

Si vous pensez que cela peut être un MVC problème de dépendance, je vous conseille d'aller dans Nuget et la suppression de tous vos MVC paquets liés, et ensuite, la recherche de l' Microsoft.AspNet.Mvc paquet et l'installer. Je suis l'aide de la version la plus récente et à venir comme v. 4.0.20710.0. Que devrait saisir toutes les dépendances dont vous avez besoin.

Aussi, si vous avez utilisé pour être à l'aide de MVC3 et tentent maintenant d'utiliser MVC4 vous voulez aller à votre site web.config(s) et mise à jour de leurs références pour pointer vers la version 4.0 de la MVC. Si vous n'êtes pas sûr, vous pouvez toujours créer une nouvelle MVC4 app et copiez le web.config à partir de là. N'oubliez pas le web.config dans vos Vues/Zones de dossiers si vous le faites.

Mise à JOUR: j'ai trouvé que ce que vous avez besoin est le package Nuget Microsoft.AspNet.Web.Optimization installé dans votre projet. Il est inclus par défaut dans une MVC4 RTM application, peu importe si vous spécifiez le framework cible de 4,5 ou 4.0. C'est l'espace de noms que le groupement classes sont incluses dans, et ne semble pas être dépendante sur le cadre. Je l'ai déployé sur un serveur qui n'a pas de 4.5 est installé et il fonctionne toujours comme prévu pour moi. Assurez-vous que la DLL est déployé avec le reste de votre application.

12voto

Hao Kung Points 13035

Juste pour clarifier un peu les choses, Système.Web.Optimisation (aka le Groupage/Minification) vont à l'encontre de 4.0. Il n'est pas en fonction de quoi que ce soit dans la version 4.5, donc il devrait y avoir aucun problème.

Si le script regroupement est au travail, et c'est un problème de css, peut-être le problème avec les url relatives?

J'aimerais tout d'abord regarder le rendu de la page et de voir si vous êtes l'obtention de références à la css bundle, c'est à dire quelque chose comme:

<link href="http://stackoverflow.com/app/Content/css?v=oI5uNwN5NWmYrn8EXEybCI" rel="stylesheet"/>

Si vous êtes, alors le regroupement travaille, mais quelque chose à l'intérieur de votre css bundle est foiré. Habituellement, cela est dû à des url relatives à l'intérieur de votre css bundle est incorrect, c'est à dire si vos images en direct sous ~/Contenu, mais vous le nom de votre bundle ~/bundles/css, le navigateur, à tort, regardez pour les images sous ~/bundles.

Aussi, le comportement par défaut est de désactiver le regroupement et la minification quand debug=true. Donc si vous ne voulez optimisations activé même lorsque debug=true, vous aurez besoin de force:

BundleTable.EnableOptimizations = true

Mise à jour: Avec les nouvelles informations que v="", cela signifie que le paquet est vide, vous devez vérifier que vous ajoutez des fichiers pour le paquet correctement, et qu'il les a trouvés. Comment êtes-vous y compris les fichiers pour le paquet?

10voto

Kurt Points 88

Omettre de runAllManagedModulesForAllRequests = "true" a également fonctionné pour moi. Ajoutez la configuration suivante dans web.config:

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

"runAllManagedModulesForAllRequests" imposera un impact négatif sur les performances de votre site Web s'il n'est pas utilisé correctement. Consultez cet article: http://bartwullems.blogspot.com/2012/06/optimize-performance-of-your-web.html

-6voto

Mohammad Points 1

J'ai eu le même problème . je viens de convertir

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

et c'est travaillé. il suffit de ne pas oublier de convertir

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

prends du bon temps

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X