我正在使用 Bundle Transformer用于 MVC5 元素中的 LESS 编译。我的 LESS 包包含一个 main.less 文件,该文件导入位于子文件夹中的其他文件。一些文件包含对图像文件的引用,就像这样 - 这在文件 /css/structure/header.less
中:
.site__logo {
background: url('../img/logo.png') no-repeat;
// ...
}
在编译包 (/css/lessBundle
) 中变成:
background: url('/css/img/logo.png') no-repeat;
我希望在捆绑时保留 .less 文件中的相对路径,以便它正确指向 /img/logo.png
,而不是 /css/img/logo .png
。我认为 Bundle Transformer 负责转换相对路径 -- documentation有这一段,但没有进一步详细说明:
You also need to understand that when you plug instances of CssTransformer and JsTransformer classes, then you plug in a set of transformations (choice between debug and pre-minified versions of files, translation code from the intermediate languages, runtime code minification, transformation of relative paths to absolute (only for CSS-code) and code combining). A set of transformations depends on what the modules of Bundle Transformer you have installed and settings you have specified in the Web.config file.
这是我的 BundleConfig:
public class BundleConfig
{
public const string LessBundlePath = "~/css/lessBundle";
public static void RegisterBundles(BundleCollection bundles)
{
var nullBuilder = new NullBuilder();
var cssTransformer = new CssTransformer();
var nullOrderer = new NullOrderer();
// Skip JS-related stuff
var lessBundle = new Bundle(LessBundlePath)
.Include("~/css/main.less");
lessBundle.Builder = nullBuilder;
lessBundle.Transforms.Add(cssTransformer);
lessBundle.Orderer = nullOrderer;
bundles.Add(lessBundle);
BundleTable.EnableOptimizations = true;
}
}
/css/main.less
大部分只是一堆导入:
@import "bootstrap/bootstrap";
@import "structure/header";
// etc.
html, body {
height: 100%;
}
我试过在 web.config 中使用这个设置,但没有效果:
<css defaultMinifier="NullMinifier" disableNativeCssRelativePathTransformation="true">
如果可能的话,我宁愿不更改 .less 文件中的文件路径,因为它们是由第三方提供的,并且在他们的集成服务器(未使用 .NET)上一切正常。还有什么我可以做的吗?
最佳答案
在BundleTransformer.Less和 BundleTransformer.SassAndScss模块不能禁用相对路径到绝对路径的转换,因为它可以在使用 @import
指令时破坏对图像的引用。
要获取 /img/logo.png
而不是 /css/img/logo.png
你只需要在源代码中正确指定一个相对路径 (../../img/logo.png
而不是 ../img/logo.png
)。
关于css - 停止 Bundle Transformer 在 LESS 中转换相对路径,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24081275/