我可以延迟加载更少的文件，仍然使用变量吗？

Question

所以我有这个函数可以延迟加载更少的文件：

var addLess = function(url) {
  $('head').append('<link rel="stylesheet" type="text/less" href="' + url + '" />');
  var newStyle = $('link[href="' + url + '"]').get(0);
  less.sheets.push(newStyle);
  less.refresh();
}

但是如果我在调用addLess

时已经加载了我的main less文件中的var

@valentine: #ef26ac;

当我调用addLess

时，我无法引用var

.content {
  background: @valentine;
}

抛出

NameError: variable @valentine is undefined

有人看到我可以解决这个问题吗？

Answer 1

LESS不会读取加载到html文件中的变量“（因为你的延迟加载正在进行）。在加载较少的时候，它变成了css。

对于较少的文件从另一个较少的文件读取变量，较少的文件必须@imported到较少的代码本身的第一个文件中。

所以你应该有一个“variables.less”文件或类似文件，并@import将文件放入每个可能需要变量的文件中。