gulp-less打包后calc属性计算不准确的问题

.step-item{
    width: calc((100% - 50px) / 2);
    &:nth-child(2){
        margin-right: 0;
    }
}

这样直接写的话，编译时会直接给你计算了，这时到浏览器上的calc里面的值是不准确的。改为下面这样写就解决了

.step-item{
    width: calc(~'(100% - 50px) / 2');
    &:nth-child(2){
        margin-right: 0;
    }
}

在前面加~符号，后面加引号包上，为什么会这样，我暂时还没查到，有知道的朋友可以解答我一下。