Less.js: modifyVars 没有被传递

创建于 2018-02-23  ·  6评论  ·  资料来源: less/less.js

我有一个 index.less 文件,它决定通过如下变量加载哪些变量文件:

@theme-variant: "a-theme.less";

<strong i="6">@import</strong> "./@{theme-variant}";

我在该索引文件中加载的文件较少:

<strong i="10">@import</strong> "~theme-variant-variables";

我在我的webpack.config.js文件中为变量设置一个值:

lessOptions.modifyVars = {
   "theme-variant": `"${v}-theme.less"`
}

如果我将 index.less 文件的内容移动到直接导入的 less 文件中,一切都按我的预期工作,我可以根据 webpack 配置逻辑切换选择的变量文件,遗憾的是,如果我尝试将这两行 less 集中到一个直接导入的较少文件导入自己的文件它停止工作。 我看到更少的加载器调用更少的预期配置,所以我猜测更少的编译器不会将变量/选项传播到导入的更少文件。 这是预期的吗?

所有6条评论

我想这与 #2772 中的内容相同 - 请参阅那里的讨论中间(例如modifyVars具有定义变量的效果,但它是已经评估了感兴趣的导入语句之后)。 但也请参阅https://github.com/less/less.js/issues/1400#issuecomment -137128461。

简而言之,import 语句中的变量插值是一件很方便的事情,但它直接与惰性求值原则相冲突。 因此,如果涉及到复杂的结构,最好找到其他方法来实现这种自定义(例如,对不同的主题文件使用不同的目录,然后设置相应的paths选项进行切换)。

谢谢回复。 该变量在由JS直接导入的less文件中更新,它只是由其他没有更新其变量的less文件导入的文件。 在这两种情况下肯定会发生惰性评估吗? 看起来 modify var logic/config 没有被应用/传递到较少导入的文件。 还是我错过了什么?

该变量在由JS直接导入的less文件中更新,它只是由其他没有更新其变量的less文件导入的文件。

嗯,比这更棘手。 请注意,要使惰性评估起作用,编译器必须按类型而不是按它们在代码中出现的顺序来评估各种语言实体(在同一范围内),从较高级别到较低级别,即(大致):导入->混合- > 变量。
现在,如果您有<strong i="9">@import</strong> "@{var}";编译器被迫在导入(以及所有后续导入)之前评估给定变量 - 这就是破坏整个事情的原因(通常这种滥用的结果只是未定义 - 它在一种情况下有效(大部分非常简单),在其他情况下无效)。

当两个直接冲突的功能组合在一起时,编译器无法保证任何一致的行为。

换句话说,并不是modifyVars不会在后续导入中“更新变量”,而是更新的变量值本身不会对外部级别的导入产生任何影响(因为这些导入已经“完成”)。


即使文档说:

请注意,在 v2.0.0 之前,仅考虑已在根或当前范围中声明的变量,并且在查找变量时仅考虑当前文件和调用文件。

...在 v2 之后并没有好多少。 它确实改进/kludge-fix 更多组合/用例,但不能修复所有这些。 有关更多详细信息,请参阅#1108,特别是#2246。


看起来 modify var logic/config 没有被应用/传递到较少导入的文件。

否(只是因为最终文件作为一个大字符串一起评估)。 除非问题出在其他地方,否则只需添加:
foo {bar: @theme-variant}
到感兴趣的文件并查看结果。

顺便一提。 对于您的用例(如果“*-theme.less”仅与特定主题的变量/混合)有关,您可以尝试以下操作:

  • 将默认的<strong i="7">@import</strong> "a-theme.less";保留在那里(即没有任何插值)或完全删除它。
  • 使用modifyVars设置导入语句本身(例如<strong i="11">@import</strong> "custom-theme.less";直接)。

请注意,虽然modifyVars假装它只是关于变量 bla-bla-bla - 实际上它只是将任意文本附加到根文件的末尾。 即在lessc的情况下,它实际上只是--modify-vars="whatever-less-code foo {bar: baz;}" 。 我不知道 webpack 的 less-loader 可以通过什么格式,嗯... lessOptions.modifyVars = "an arbitrary code";也许?

这显然是一种 hack,但实际上它是相当可预测的 hack(因为它只滥用modifyVars格式,而不是像最初的组合那样滥用语言本身)。

非常感谢您的回复和想法@seven-phases-max 我将在本周进一步调查并设置提醒以在本周晚些时候更新/关闭此问题。 再次感谢。

然后我将关闭它,因为它更像是预期的(在这种情况下定义为“未定义/未指定”)行为,而不是可以以某种方式实际修复的问题。
尽管任何改进想法,尤其是 PR 总是受欢迎的......我认为在可预见的未来没有人会进入这个领域。

此页面是否有帮助?
0 / 5 - 0 等级

相关问题

BrianMulhall picture BrianMulhall  ·  4评论

papandreou picture papandreou  ·  7评论

xblakestone picture xblakestone  ·  3评论

vecerek picture vecerek  ·  5评论

pknepper picture pknepper  ·  3评论