vsCode 配置 easy sass 插件转换 css、wxss、acss

vsCode 配置 easy sass 插件转换 css、wxss、acss

问题描述

小程序开发有时会使用 easy sass 插件，在 vsCode 中配置自动转换，以下为配置方式：

解决方案

先附上下图，再来一步步配置；

1. vsCode 中安装 easy sass 插件；
2. 建一个文件夹.vscode
   .vscode 文件夹下建一个叫 settings.json 的文件（针对于当前项目的配置，全局的配置在全局的 settings.json 里添加）
   settings.json 中配置内容如下：

"easysass.formats": [
    {
        "format": "expanded",  // 没有缩进的、扩展的css代码
        "extension": ".wxss"  //转化的后缀名
    },
]

3. easysass.formats 是设置编译输出的 css 风格的，可以同时编译输出多个不同风格的 CSS 文件;

easysass.formats.format 支持四个选项用以编译生成对应风格的 CSS：

• nested：嵌套缩进的 css 代码。
• expanded：没有缩进的、扩展的css代码。
• compact：简洁格式的 css 代码。
• compressed：压缩后的 css 代码。

easysass.formats.extension 顾名思义就是设置编译输出的文件名了