大型网站流量,得到app官网,wordpress技术博客主题,辽宁住房和城乡建设网站在更换之前#xff0c;首先了解sass与less在用法上的区别有哪些#xff08;这里简单提几个#xff09;#xff1a;
变量区别#xff1a;Less中用#xff0c;Sass用$sass支持条件语句#xff0c;可以使用if{}else{}、for循环等#xff0c;而less不支持在定义变量时候首先了解sass与less在用法上的区别有哪些这里简单提几个
变量区别Less中用Sass用$sass支持条件语句可以使用if{}else{}、for循环等而less不支持在定义变量时候如果要将此变量作为类名使用less中类名变量的值是没有引号的而sass有sass中如果变量需要在字符串中嵌套则需要使用#加大括号包裹less中是变量名使用大括号包裹
less定义变量作为类名使用
theme-namedark;
.theme-{theme-name}{
...
}sass定义变量作为类名使用
$theme-name:dark;
.theme-#{$theme-name}{
...
} 字符串嵌套变量sass举例 border-#{$right}:1px solid red 字符串嵌套变量less举例 border-{right}:1px solid red 第一步卸载sass相关依赖包并安装less依赖包
npm uninstall node-sass
npm install less less-loader 第二步sass文件替换成less
将 langscss 替换成 langless,对照上述区别进行更改。 过程中遇到的报错 将项目中的sass替换成less后启动项目报错
ERROR Failed to compile with 1 error 10:52:13
error in ./src/App.vue?vuetypestyleindex0id35fe2bd4prodlangless
TypeError: this.getOptions is not a function
解决这个错误是由于less-loader版本不兼容导致的直接npm install less-loader5.0.0 重新启动项目就可以了
node版本16.19.0
less版本: 4.2.0
less-loader版本5.0.0
如果还是报错试试把node_modules和package-lock.json文件删掉再重新下载npm i 或npm i -f
