在调试模式下使用BundleTransformer/LESS运行Autoprefixer

Question

所以我目前使用BundleTransformer,LESS我正在尝试添加Autoprefixer后处理器.这个插件会自动获取css transform: scale(1.5)并将其转换为-webkit-transform和-moz-transform.

如果我处于发布模式或者BundleTable.EnableOptimizations=true然后一切正常并且前缀按预期添加.

但是,在调试模式下,我的包中的所有单独的CSS/LESS文件都作为单独的请求存在于HTML中.我在我的CSHTML文件中使用此命令:

@Styles.Render("~/Content/css/lessbundle")

即在调试模式下,这会扩展到以下LINK标签:

/cs/something.css
/css/lessfile1.less
/css/lessfile1.less

而不是一个文件

/Content/css/lessbundle?v=RFAUSIwb-jEuuo4vHNTnTkE2LrN2jfHglX-Hk8HIF481

对于LESS文件,IIS会自动转换它们,但它不适用Autoprefixer.

在请求原始文件.css和.less文件时,有没有办法让Autoprefixer工作？

如果不是这对我来说似乎毫无意义,因为我看到的唯一选择是直接请求'Content/css/lessbundle虚拟URL - 它将通过Autoprefixer.它只会在发布版本中缩小.

Answer 1

在文档(部分:"使用示例","调试HTTP处理程序"和"后处理程序")中介绍了如何解决此问题.我将列出基本步骤:

1. 对于调试HTTP处理程序来使用bundle中的配置设置需要在file RegisterBundles方法中 添加App_Start/BundleConfig.cs以下代码:

   BundleResolver.Current = new CustomBundleResolver();

2. 为了这些设置可以应用于CSS-和JS-资产需要注册调试HTTP的处理程序CssAssetHandler和 JsAssetHandler在Web.config文件.要在IIS集成模式下执行此操作,您需要向/configuration/system.webServer/handlers元素添加以下代码:

   <add name ="CssAssetHandler"path ="*.css"verb ="GET"type ="BundleTransformer.Core.HttpHandlers.CssAssetHandler,BundleTransformer.Core"resourceType ="File"preCondition =""/>

   <add name ="JsAssetHandler"path ="*.js"verb ="GET"type ="BundleTransformer.Core.HttpHandlers.JsAssetHandler,BundleTransformer.Core"resourceType ="File"preCondition =""/>

3. 要使make AutoprefixCssPostProcessor成为默认的CSS后处理器之一,您需要对Web.config文件进行更改.在element 的defaultPostProcessors属性中\configuration\bundleTransformer\core\css必须添加AutoprefixCssPostProcessor到以逗号分隔的列表的末尾(例如, defaultPostProcessors="UrlRewritingCssPostProcessor,AutoprefixCssPostProcessor").