17

Estoy implementando la compatibilidad de agrupamiento y minificación en MVC4 y configurándolo para que pueda compilar automáticamente mis archivos Bootstrap .less para mí. Tengo el siguiente código en el archivo BundleConfig.cs mis¿Por qué MVC4 @ Styles.Render() no se comporta como se esperaba en el modo de depuración

public class BundleConfig 
{ 
    public static void RegisterBundles(BundleCollection bundles) 
    { 
     // base bundles that come with MVC 4 

     var bootstrapBundle = new Bundle("~/bundles/bootstrap").Include("~/Content/less/bootstrap.less"); 
     bootstrapBundle.Transforms.Add(new TwitterBootstrapLessTransform()); 
     bootstrapBundle.Transforms.Add(new CssMinify()); 
     bundles.Add(bootstrapBundle); 
    } 
} 

El TwitterBootsrapLessTransform es la siguiente (que es más complicado de lo que quisiera debido a la necesidad de importar los archivos de la sub .less en dotless)

public class TwitterBootstrapLessTransform : IBundleTransform 
{ 
    public static string BundlePath { get; private set; } 

    public void Process(BundleContext context, BundleResponse response) 
    { 
     setBasePath(context); 

     var config = new DotlessConfiguration(DotlessConfiguration.GetDefault()); 
     config.LessSource = typeof(TwitterBootstrapLessMinifyBundleFileReader); 

     response.Content = Less.Parse(response.Content, config); 
     response.ContentType = "text/css"; 
    } 

    private void setBasePath(BundleContext context) 
    { 
     BundlePath = context.HttpContext.Server.MapPath("~/Content/less" + "/imports" + "/"); 
    } 
} 

public class TwitterBootstrapLessMinifyBundleFileReader : IFileReader 
{ 
    public IPathResolver PathResolver { get; set; } 
    private string basePath; 

    public TwitterBootstrapLessMinifyBundleFileReader(): this(new RelativePathResolver()) 
    { 
    } 

    public TwitterBootstrapLessMinifyBundleFileReader(IPathResolver pathResolver) 
    { 
     PathResolver = pathResolver; 
     basePath = TwitterBootstrapLessTransform.BundlePath; 
    } 

    public bool DoesFileExist(string fileName) 
    { 
     fileName = PathResolver.GetFullPath(basePath + fileName); 

     return File.Exists(fileName); 
    } 

    public byte[] GetBinaryFileContents(string fileName) 
    { 
     throw new System.NotImplementedException(); 
    } 

    public string GetFileContents(string fileName) 
    { 
     fileName = PathResolver.GetFullPath(basePath + fileName); 

     return File.ReadAllText(fileName); 
    } 
} 

en mi página _Layout.cshtml base de E intentaron hacer que los archivos CSS al hacer esto

@Styles.Render("~/bundles/bootstrap"); 

como lo sugiere el mvc tutorial pero el archivo del cli t El navegador termina pidiendo es

http://localhost:53729/Content/less/bootstrap.less 

que causa un error. Si pongo el siguiente enlace en la página de diseño base, funciona como se esperaba.

<link href="~/bundles/bootstrap" rel="stylesheet" type="text/css" /> 

¿Por qué @ Styles.Render() no se comporta de la misma manera en el modo de depuración? Funciona en modo de lanzamiento. Puedo entender cómo no quiere que se agrupe y minimice la depuración, pero ¿cómo puedo forzar que este paquete funcione de la misma manera siempre?

+0

me encontré con este fragmento de código muy útil. Debería considerar hacer una publicación en un blog acerca de cómo consiguió que Twitter Bootstrap y Dotless trabajaran juntos. – Junto

+0

Gracias, tal vez cuando tenga más tiempo para mí comenzaré a bloguear. – PlTaylor

+0

@PITaylor Fuera de interés, verá los siguientes tipos de errores en el resultado de css: Error de la minificación. Devolviendo contenido no modificado. (1381,2): error en tiempo de ejecución CSS1019: Token inesperado, encontrado '{' ... – Junto

Respuesta

10

Lo que terminé haciendo fue poner una declaración de depuración en mi _Layout.cshtml para que el paquete se procesara sin importar nada. No estoy loco por eso como una solución, pero está funcionando por ahora.

@if (Context.IsDebuggingEnabled) 
{ 
    <link href="~/bundles/bootstrap" rel="stylesheet" type="text/css" /> 
} 
else 
{ 
    @Styles.Render("~/bundles/bootstrap") 
} 
31

Así que, básicamente, cuando debug="true", el script/estilo de visualización métodos suponen que optimizaciones están apagados, significa que no hay ninguna agrupación y la minimización, lo que significa que no va a poner en su transformación; en cambio, simplemente renderizará enlaces a los contenidos brutos del paquete (que es boostrap.less en su caso).

Puede anular este comportamiento y ejecutar siempre la optimización configurando BundleTable.EnableOptimizations = true. Esto obligará a los métodos de renderizado a agrupar/minificar siempre.

+0

¿Puede establecer esto como verdadero para un paquete específico? – PlTaylor

+0

Actualmente, este no es un interruptor global, activa/desactiva la agrupación/minificación en toda su aplicación –

+1

Quería editar su publicación porque supongo que el nombre de la propiedad no es EnalbeOptimizations, sino EnableOptimizations. StackOverflow no permite 1 edición de caracteres ... :-( –

4

Me evitar esto dejando sin punto servir el archivo .less

en web.config:

<handlers> 
    <add name="dotless" path="*.less" verb="GET" type="dotless.Core.LessCssHttpHandler,dotless.Core" resourceType="File" preCondition="" /> 
    </handlers> 
Cuestiones relacionadas