解决项目中 sass 和 less并存需要统一的问题

Posted 2023-03-08

参考技术A 目前场景是接到的项目中没有统一样式处理，例如不同模块，有的使用了 sass ，有的使用了less。

我们知道sass是成熟、稳定、强大的 CSS 预处理器，而 SCSS 是 Sass3 版本当中引入的新语法特性，完全兼容 CSS3 的同时继承了Sass强大的动态功能。

而Less 是一门 CSS 预处理语言，它扩展了 CSS 语言，增加了变量、Mixin、函数等特性，使 CSS 更易维护和扩展。Less 可以运行在 Node 或浏览器端。

两者各有千秋，没有特殊洁癖个人觉得均可，但是因为项目中使用了 ant-desgin-vue, 而它本身是使用less的，于是决定项目中还是统一使用 less 吧。

1、首先移除 node-sass 和 sass-laoder

2、将所有的 lang="scss" 替换成 lang="less"

3 、变量控制定义： 将 $ 更改为 @

4、.scss 后缀文件改为 .less
例如 下面引入的 chart.scss 文件，应该改为 chart.less