解决 Hexo 升级 7.0.0 后，因为 hexo-renderer-less 升级到 4.0 导致主题样式异常的问题

经验笔记
浏览 loading

升级Hexo到 hexo 7.0 后因为一起升级了 hexo-renderer-less 到 4.0 导致主题里面相关样式异常。

经过一番检查发现，less 样式中 / 都没有进行运算而是直接输出，导致css语法错误无法渲染。

因为 less 中 除法“/”运算有问题，在 less 4.0 不在支持直接使用/进行除法运算。

只要在使用 / 进行运算时，必须在()内使用/，用()包含之前的运算即可，如下

1
2
3
4
5
6
7
8
9
# 修改前 less 4.0 不支持
.post-wrapper {
        padding: @gap/2;
}

# 修改后 less 4.0 支持
.post-wrapper {
        padding: (@gap/2);
}

以下是官方的说明。

However, you may find Less’s Color Functions more useful.
From 4.0, No division is performed outside of parens using / operator.

然而，你可能会发现Less的颜色函数更有用。
从4.0版本开始，在括号外没有使用/操作符进行除法。

You can change Math setting, if you want to make it always work, but not recommended.
如果您想让数学设置始终有效，您可以更改数学设置，但不建议这样做。

Relay Tips: 一极乐（ https://yijile.com/log/608/ ）