Question

对于不太具描述性的问题感到抱歉，但我不知道还有什么可说的，它真的很疯狂。

在我的机器上安装了grunt-contrib-compass，我的package.json中有这一行......

＆＃34; grunt-contrib-compass＆＃34;：＆＃34; 1.0.1＆＃34;，

我的grunt文件正常运行并正在编译我的SASS，除了没有数学运算。当我向Github提交并且我的同事编译它时，数学运算，即使他有与我相同的设置。通过npm install安装相同的grunt文件和相同的npm包。

为了测试什么在起作用，什么不起作用，我在SASS中设置了以下部分。我评论了我想要的工作，其他的只是测试用例。

$hSpace: (20px, 24px, 30px, 30px, 40px, 60px);

.xxx{
    padding: 10px;
    padding: 10px/2;
    padding: 10/2;
    padding: 10/2 * 1px;
    padding: nth($hSpace, 3)/2;   <---- This one
    padding: nth($hSpace, 3);
    padding: 30/2px;
    padding: 30/2 * 1px;
}

这是我运行grunt时的输出。

.xxx {
    padding: 10px;
    padding: 10px/2;
    padding: 10/2;
    padding: 5px;
    padding: 30px/2;     <---- Produces this
    padding: 30px;
    padding: 30/2px;
    padding: 15px;
}

这就是我的同事咕噜咕噜时的样子。

.xxx {
    padding: 10px;
    padding: 10px/2;
    padding: 10/2;
    padding: 5px;
    padding: 15px;      <---- When it should produce this
    padding: 30px;
    padding: 30/2px;
   padding: 15px;
}

我们的设置看起来完全相同，所以我真的无法理解为什么我的编译器无法正常工作。

非常感谢任何想法，即使他们只是猜测。

Answer 1

我可以使用上面评论中所述的版本号重现此错误。虽然我建议您按照我在评论中的建议检查您的版本号，但您可以通过将/2更改为* 0.5来解决此问题，我建议您使用的软件包版本不同作为你的同事，不支持/在划分代码的语法中有错误。

$ hSpace :( 20px，24px，30px，30px，40px，60px）;

.xxx{
    padding: 10px;
    padding: 10px/2;
    padding: 10/2;
    padding: 10/2 * 1px;
    padding: nth($hSpace, 3) / 2;
    padding: nth($hSpace, 3);
    padding: 30/2px;
    padding: 30/2 * 1px;
}

编译到

.xxx {
    padding: 10px;
    padding: 10px/2;
    padding: 10/2;
    padding: 5px;
    padding: 30px/2;
    padding: 30px;
    padding: 30/2px;
    padding: 15px;

}

虽然

.xxx{
    padding: 10px;
    padding: 10px/2;
    padding: 10/2;
    padding: 10/2 * 1px;
    padding: nth($hSpace, 3) * 0.5;
    padding: nth($hSpace, 3);
    padding: 30/2px;
    padding: 30/2 * 1px;
}

编译到

.xxx {
    padding: 10px;
    padding: 10px/2;
    padding: 10/2;
    padding: 5px;
    padding: 15px;
    padding: 30px;
    padding: 30/2px;
    padding: 15px;
}

这是你的同事所拥有的。

Sass / Compass在编译时不做数学运算

1 个答案: