微信小程序下使用less扩展语言开发

前端小高 - 2021-11-09 08:03:11

记录一下，如何在微信小程序下使用less扩展语言编写样式使用vscode打开微信小程序项目
在需要使用到less文件的目录下，新建一个index.less文件，如下图所示

安装vscode插件

安装完毕后需要启用该插件

3.vscode窗口下，按下快捷
CTRL + SHIFT + P
在出现的输入框内输入
open settings
点击下图中所示选项

4.修改settings.json文件下的内容（可以先搜索是否存在该属性，如果不存在则新增一个）

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

按下ctrl + s 保存文件

5.尝试在新增的index.less文件下进行编辑（编辑完毕记得保存），例如

此时再打开同一路径下的index.wxss文件

细心的你会发现，wxss文件下为less文件编译后的内容，那么恭喜你，配置成功了。

特别申明：本文内容来源网络，版权归原作者所有，如有侵权请立即与我们联系（cy198701067573@163.com），我们将及时处理。