Comment résoudre les chemins d'image dans les bundles de styles MVC4 ?

Résolution des images MVC4 StyleBundle

Le regroupement de CSS dans MVC4 pose un défi lors de la gestion de CSS autonomes et d'ensembles d'images comme ceux que l'on trouve dans l'interface utilisateur jQuery. Pour garantir une résolution correcte des images, suivez ces directives :

Définition du StyleBundle

Lors de la création d'un StyleBundle, spécifiez un chemin virtuel qui n'entre pas en conflit avec un chemin de contenu physique . Par exemple :

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

Chemins d'image relatifs

Les chemins d'image dans le CSS doivent être relatifs au fichier CSS lui-même. Ceci est important car le gestionnaire de bundle remplacera le chemin virtuel dans l'URL par le chemin réel vers le CSS groupé.

Regroupement de CSS à partir du même dossier

Regroupement de CSS les fichiers du même dossier garantissent que les chemins d’image relatifs continueront à fonctionner. Définissez votre bundle sur le même chemin que les fichiers sources :

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

CssRewriteUrlTransformation

Alternativement, vous pouvez appliquer une CssRewriteUrlTransformation pour réécrire les références d'URL relatives aux fichiers CSS lorsque groupé. Cela permet de regrouper différents dossiers tout en conservant la résolution de l'image :

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

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!