Question

我有一个奇怪的问题，我还没有看到过。我试图对这样的一些变量做一些基本的补充：

@screen-break-sm:       768px;
@screen-break-md:       992px;

@screen-max-mobile:     @screen-break-sm;
@screen-min-desktop:    @screen-break-sm + 1;

然后，这些值正在某些媒体查询中使用。当它通过Gulp使用gulp-less（package.json中的版本~3.0.0）进行编译时，输出结果如下：

@media (min-width:768px + 1) {
   // CSS
}

我期待：

@media (min-width:769px) {
   // CSS
}

我尝试同时添加@screen-break-sm + 1和screen-break-sm + 1px。我还尝试删除原始值的px部分，然后执行添加并添加px，但这也不会添加。

如果它是相关的，这是构建我第一次遇到这个问题的部分的gulp脚本之一：

module.exports = function (build) {
    return function () {

        var pagesPath = build.options.styles.buildPath + '/pages/';

        return build.gulp.src('./resources/assets/less/pages/**/*')
            .pipe(build.plugins.less({
                paths: [ build.plugins.path.join(__dirname, 'less', 'vendor', 'theme', 'bootstrap') ]
            })).on('error', build.errorHandler)
            .pipe(build.plugins.minifyCss()).on('error', build.errorHandler)
            .pipe(build.plugins.extReplace('.min.css')).on('error', build.errorHandler)
            .pipe(build.gulp.dest(pagesPath));
    };
};

任何想法为什么LESS连接/追加而不是执行添加？

[编辑]

虽然解决方案与被识别为可能重复的其他问题相同，但该问题并未讨论用户将直接遇到的问题，因此我认为此问题更适合于搜索目的。经过一个小时的谷歌搜索后，我才找到解决方案，只有在得到答案和严格的数学后才能找到解决方案。 verbiage确实出现了其他问题。

Answer 1

查看strict math option哪个默认值为OFF。您确定由于某种原因没有将其设置为ON吗？

lessc -sm=on
lessc --strict-math=on

添加少量加法运算符（+）而不是添加

1 个答案: