无法使 dotLESS @import 工作

Question

我正在努力使用 dotLESS @import 来获得一个单独的变量文件；我只是经常收到 "variable is undefined".

如果我浏览到变量配置文件，它就可以工作；如果我将变量内嵌在主样式表中，它就可以工作；但在@import 中，没有骰子。我将 .css 和 .less 映射到扩展名，但是如果我只使用 .less 它也不起作用。

变量文件 LESS-config.less 是：

/*
  .LESS VARIABLES
*/
@mbw_dark_cyan: #1293b5;
@mbw_cyan: #11add4;
@mbw_magenta: #e935da;

@control_text: #ffffff;

@action_delete: #ff5400;

@section_level1_bg: @mbw_dark_cyan;
@section_level1_fg: @control_text;

@button_bg: @mbw_dark_cyan;
@button_fg: @control_text;
@button_icon: @control_text;

@data_table_header: @mbw_cyan;

.dummy {
    color: @control_text;
}

呈现为：

/*
  .LESS VARIABLES
*/
.dummy {
  color: #ffffff;
}

调用样式表 main.css 是：

@import (less) '/css/LESS-config';

button {
    background: @button_bg;
}

给出错误：

variable @button_bg is undefined on line 4 in file '/css/main.css':
  [3]: button {
  [4]:     background: @button_bg;
       ----------------^
  [5]: }

正如我所说，如果我用复制和粘贴的相同变量替换导入，一切正常。

我试过在另一个答案中不使用 BOM 进行保存，但这没有帮助。

编辑，我试过了：

删除（较少）
改为双引号
使用相对路径 LESS-config 而不是上面的虚拟绝对路径
添加logger="dotless.Core.Loggers.AspResponseLogger" log="debug"到 web.config（cache 已经是 false）
添加debug="1"
正在添加 debug="true"

行为完全没有变化。

编辑 2：

我创建了一个缩减版 css，其中只有 import 语句；当我浏览它时，导入的样式就在那里。然而，在刷新时，我只得到一个空白的响应。

所以这似乎与我的 IIS 配置/缓存有关？我已经关闭了内容压缩但没有快乐；禁用 .less 和 .css 的所有输出缓存，仍然不开心！

FIXED 根据 Toni 的评论； :

这原来是一个无点问题，在 GitHub 上进行了跟踪：https://github.com/dotless/dotless/issues/553

完整的修复是：

将 dotLESS 升级到版本 1.6.7
由于 Method not found error

Microsoft.Extensions.DependencyInjection

将导入的文件扩展名从 .css 更改为 .less

现在一切正常。

Answer 1

我可能发现你有两个问题。

您正在尝试在 css 文件中调用 @import (less)。这是 less 框架特有的语法。
你的main.css不是less文件

将 main.css 更改为 main.less 文件，然后尝试从 main.less 生成 css 作为根文件。假设您的 import url for LESS-config.less 是正确的。上面提到的更正应该可以解决问题。

Answer 2

@import (less, optional) "mystyle.css"; 是 Less 语法，不能用在 CSS (Less @import Rules ).

如果你想在你的CSS中使用@import，它应该遵循这个语法(See here)

@import url|string list-of-mediaqueries;

但是，无论如何，您无法在 CSS 中导入 Less 文件。

我会这样做的方式：

假设您有 3 个 .less 文件：config.less、color.less、header.less

我将创建一个包含以下内容的 style.less 文件：

/*------------------------------------------------------------------------------*/
                                   style.less
/*------------------------------------------------------------------------------*/

/* 01. config */
@import "config.less";

/* 02. color */
@import "color.less";

/* 03. header */
@import "header.less";

然后我会编译 style.less 这会产生 style.css 我会包括 style.css 在我的网站上。

Answer 3

请尝试版本 1.6.7，它修复了仅在第一个请求时执行导入的错误。

无法使 dotLESS @import 工作

Can't get dotLESS @import working

.net

css

iis

less

dotless