小程序中使用less

原生小程序不支持Less,其他基于小程序的框架大体都支持,如webp,mpvue,taro。但我们不能为了使用Less,而引入一个框架,所以可以用下面的方法实现:
1)编辑器是vscode
2)安装插件 easy Less

小程序中使用less_第1张图片
3)在vscode中的设置中加入如下配置:

"less.compile":{
	"outExt":".wxss"
}

小程序中使用less_第2张图片
小程序中使用less_第3张图片
4)在编写样式的地方,新建less文件或者把.wxss文件改为.less文件,如index.less,然后正常编辑即可。
把.wxss文件改为.less文件,保存以后会在这个文件夹内自动生成.css文件
小程序中使用less_第4张图片
在这个.less文件里面也可以引入其他Less文件,保存后可以自动在wxss文件里面编译

小程序中使用less_第5张图片

你可能感兴趣的:(微信小程序,前端)