vscode 配置踩坑记

时间:2023-12-26 14:16:25

vscode-easy-less

遇到问题最好的解决方式是看官网文档,切记!!!

在web开发当中,经常会写less然后编译成css,当然在VS Code当中也有这样的插件(EasyLess),

但是当我们创建一个.less文件,写相关代码进行保存时,会发现它会在.less文件同目录生成对应名字的.css文件,

当页面过多时,就会导致目录文件过多而且看起来不清晰,所以一般会把.less和.css分别放在不同的目录下,

这样就需要我们配置一下less文件编译为css的时候所生成文件的位置,

配置方法如下:

在VS Code项目中,有一个.vscode的文件夹,找里面的settings.json文件,没有的话自行创建,

打开settings.json文件,没有的话自行创建,

添加代码:

{
  "less.compile": {
    "compress": true,
    "out": "${workspaceRoot}/src/css/",
  }
}
注意:此处的/不可写成\\,否则css文件自动编译失败(但是网上都是说写成\\格式的,我用这种格式写生成的css文件没有在对应的css文件夹下,改成/才生效)