如何在微信开发者工具中写Sass和Less

在微信开发者工具中写Sass和Less，自动编译为wxss

文章目录

一、前言

二、步骤

1.打开vscode，下载插件

2、打开微信开发者工具，导入插件

3、配置（使得less 和 sass文件编译为wxss）

三、总结

---

一、前言

        最近在做公众号到小程序的迁移，之前公众号用的是js+less，创建微信小程序的时候，发现不使用云服务的模板中没有JS+Less的的选项，于是选择了基础JS，再这个的基础上，希望能在里面写less的，顺便把在微信开发者工具中sass的使用的一起学习了（其实两者步骤是差不多滴~）

---

二、步骤

1.打开vscode，下载插件

插件Easy Less 和 Easy Sass

2、打开微信开发者工具，导入插件

（1）找到这个导航栏中的扩展，点击

（2）导入已安装的vscode扩展（不要把刚刚那个... 搞错了哦）

3、配置（使得less 和 sass文件编译为wxss）

（1）打开json配置文件

（2）进行配置

 less需要添加：

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

sass需要添加：

"easysass.formats": [
   {
     "format": "expanded", 
     "extension": ".wxss" 
   }
],

---

三、总结

以上就是微信开发者工具中写Sass和Less的全部内容啦，目前使用起来没有什么问题，第一次写博客，希望各位大佬们多多指教~