Var*_*der 4 css asp.net-mvc less dotless bundling-and-minification
我试图使用dotless完成以下结构:
styles/variables.less - 包含所有变量,如下所示
@color:green;
Run Code Online (Sandbox Code Playgroud)
styles/component1.less - 一些导入variables.less的随机组件特定样式
@import "variables";
body {
background:@color;
}
Run Code Online (Sandbox Code Playgroud)
styles/component2.less - 一些更多样式,它们还导入全局variables.less文件
@import "variables";
a {
color:@color;
}
Run Code Online (Sandbox Code Playgroud)
BundleConfig.cs - 如下所示声明捆绑包.我正在使用这个捆绑添加:https://gist.github.com/benfoster/3924025
bundles.Add(new Bundle("~/styles/css", new LessTransform()).Include("~/styles/component1.less", "~/styles/component2.less"));
Run Code Online (Sandbox Code Playgroud)
当Debug设置为true时,一切正常

但是当Debug设置为false时
只有在Include方法中传递的第一个文件才能解析@import"变量".其余的都失败了.
下面是首先声明"〜/ styles/component1.less"的输出
bundles.Add(new Bundle("~/styles/css", new LessTransform()).Include("~/styles/component1.less", "~/styles/component2.less"));
Run Code Online (Sandbox Code Playgroud)

首先声明"〜/ styles/component2.less"时的输出
bundles.Add(new Bundle("~/styles/css", new LessTransform()).Include("~/styles/component2.less", "~/styles/component1.less"));
Run Code Online (Sandbox Code Playgroud)

奇怪的是 - 如果我在component1和component2中导入不同的文件,它会起作用
例如,如果我在任一文件中将"varibales"重命名为"variables.less",只是为了使这些导入看起来有点不同.有用.如下
款式/ component1.less
@import "variables.less"; // added extension here
body {
background:@color;
}
Run Code Online (Sandbox Code Playgroud)

有什么想法吗?几天以来我一直在努力.
编辑
使用此结构的原因:
在调试模式下发送较少的文件,因为它使调试更容易.行号注释不是很有帮助
在生产中提供时连接和缩小所有较少的文件.
在每个文件的顶部添加@import"变量"是很难看的.
因此,尝试声明变量.无.作为.Include("variables.less",文件依赖变量.无,......)的一部分,由于这里提到的一些范围问题,显然无法工作:无点 - 不能使用MVC Bundling在单独的文件中引用less变量
有一个修复,连接每个较少的文件的内容,并使用Less来解析该连接文件.这里的示例,https://groups.google.com/forum/?fromgroups#!topic/fifty/j-8OP1dNjUY
但在那种情况下,我似乎无法获得解析文件的缩小版本.
根据docos:
在v1.3.0 - v1.3.3中,@ import会多次导入文件,您可以使用@ import-once覆盖此行为.
在v1.4.0中,@ import-once已被删除,默认情况下@import导入一次.这意味着具有以下内容
忽略第二个变量导入,变量@color:green;仅在第一个组件的范围内定义; 在第二个组件的范围内未定义它可能最终会被规则或甚至整个较少的文件忽略(我不是非常熟悉默认行为,你可以添加额外的属性和规则,看看会发生什么).您可以通过检查预处理程序日志或以其他方式在控制台中跟踪其错误来确认这一点.
将"更高"级别的变量导入共享范围,如@Hans建议(+1)应解决此问题.暂定的替代方案可能是将预处理器降级到v1.3.0-v1.3.3,以便@import多次触发.由于我在处理css预处理器时的偏好几乎完全围绕它们的变量和mixin功能,我自己可能会认为这是一个可接受的选择.
| 归档时间: |
|
| 查看次数: |
2961 次 |
| 最近记录: |