vscode的less编译css插件的使用

Vscode的less装css插件

1. 安装 和使用
2. 设置修改less插件默认编译出来的css文件的存放位置

安装

1. 打开vscode软件
   

2. 输入easyless 点击Easy Less 插件进行安装
   
   

3. 使用教程
3.1 创建文件夹和文件编写代码

4. 保存或者刷新下就可以在less文件同级目录下出现一个 css文件（为编译好的）
在这里插入图片描述

设置修改less插件默认编译出来的css文件的存放位置

1. 打开文件—》首选项—》设置

2. 搜索less----》点击Easy LESS ----》点击setting.json

3. 进行配置less.compile(修改css文件生成的位置)

"less.compile": {
        "out": "${workspaceRoot}\\css\\"
    }

• less.compile 是less编译的意思
• out 属性的值 就是less编译好的css文件位置的设置
• 上面的意思就是在文件所在的工作更目录中的 css 文件夹中生成

4. 这样less编译生成的css文件就会在指定位置显示。
5. 这样就可以按下的使用less进行编译了