ser*_*erg 12 c# bundle minify less asp.net-mvc-4
在一个简单的ASP.Net MVC4测试应用程序中,我安装了无点NuGet包并遵循本教程.
我的.less文件被正确解析为CSS,并在以后正常工作debug=true.
<link href="/Public/less/main.less" rel="stylesheet"/>
<link href="/Public/less/home.less" rel="stylesheet"/>
<link href="/Public/less/a.less" rel="stylesheet"/>
<link href="/Public/less/b.less" rel="stylesheet"/>
<link href="/Public/less/c.less" rel="stylesheet"/>
Run Code Online (Sandbox Code Playgroud)
但是当我debug=false为了让它缩小并组合成单个样式表而设置时,我得到了这个:
<link href="/Public/less?v=" rel="stylesheet"/> // NOT WORKING!
Run Code Online (Sandbox Code Playgroud)
这是我的捆绑配置文件; 再次,直接从教程:
public class BundleConfig
{
// For more information on Bundling, visit http://go.microsoft.com/fwlink/?LinkId=254725
public static void RegisterBundles(BundleCollection bundles)
{
// Compile .less files and create a bundle for them.
var lessBundle = new Bundle("~/Public/less").Include(
"~/Public/less/main.less",
"~/Public/less/home.less",
"~/Public/less/a.less",
"~/Public/less/b.less",
"~/Public/less/c.less");
lessBundle.Transforms.Add(new LessTransform());
lessBundle.Transforms.Add(new CssMinify());
bundles.Add(lessBundle);
}
}
Run Code Online (Sandbox Code Playgroud)
在我的布局文件中:
<head>
@Styles.Render("~/Public/less")
</head>
Run Code Online (Sandbox Code Playgroud)
这是我的LessTransform类:
public class LessTransform : IBundleTransform
{
public void Process(BundleContext context, BundleResponse response)
{
response.Content = dotless.Core.Less.Parse(response.Content);
response.ContentType = "text/css";
}
}
Run Code Online (Sandbox Code Playgroud)
有关捆绑包无法正常工作的任何想法debug=false?
Kam*_*him 11
默认情况下,MVC 4.0中的捆绑和缩小在调试模式下是禁用的,因为缩小和捆绑会使调试非常困难甚至有时不可能.您可以通过在LessTransform.Process方法上设置断点来测试它.LessTransform.Process仅在项目使用debug = false或运行时调用BundleTable.EnableOptimizations = true.
<link href="/Public/less?v=" rel="stylesheet"/> 表示捆绑的结果为空.
请确保至少有一个较少的文件生成CSS内容,如果是这样,请检查LessTransform它必须是类:
public class LessTransform : IBundleTransform
{
void IBundleTransform.Process(BundleContext context, BundleResponse response)
{
response.Content = Less.Parse(response.Content);
response.ContentType = "text/css";
}
}
Run Code Online (Sandbox Code Playgroud)
通过放入BundleTable.EnableOptimizations = true;RegisterBundles方法,您可以在调试模式下覆盖优化机制的默认设置(Bundling and minification),然后您可以调试并检查结果Less.Parse(response.Content);
.less该问题是编译为时出现的无提示错误css。
我使用断点来检查LessTransform使用该dotless库进行编译的类。
public class LessTransform : IBundleTransform
{
public void Process(BundleContext context, BundleResponse response)
{
response.Content = Less.Parse(response.Content); // Breakpoint here.
response.ContentType = "text/css";
}
}
Run Code Online (Sandbox Code Playgroud)
我注意到,当鼠标悬停在上面时,response.Content我可以看到我的less代码,但在Less.Parse代码之后,response.Content会变成空。
我less通过检查器运行了我的代码,发现代码中存在语法错误。
一旦我修复了错误,捆绑和缩小就按预期正常工作。