首先，我比较2者，目的是为了经过编译输出的结果，而非原生使用自定义属性。
CSS变量(自定义属性)
优点：
有CSS标准支持
属于正式语法，员工学习积极性高，招人也容易。
样式编写和编译可以分离
样式编写人员基本可以自由发挥。打包怎么配置属于打包人员该做的，不需要我写样式的去考虑。
如果不懂配置编译依然能够正常运行
如果没有配置PostCSS，能够生成原生的CSS变量。在最新的浏览器上也能使用。
缺点：
不敢使用非标准PostCSS插件
由于是直接写CSS，导致标准PostCSS插件不敢轻易使用。如嵌套和mixin，当然还有最重要的颜色调整函数。
缺少颜色调整相关标准函数
颜色调整函数的草案，由color()改到了color-mod，然后又被废止了。尽管会经过PostCSS转义，仍然会觉得源代码不够标准。而使用预处理没有者方面压力。
预处理(sass\less)器
优点：
有自己独立的语法
由于写出来的是sass\less，然后再编译成css。这样的话，就敢大胆使用各种优秀的功能了。
强制要求编译输出
由于未编译不能使用，使用者必须配置好编译，不会没发现未编译导致一些错误。
缺点：
需要专门另学一门语法
会导致推动时受到抵触
