vscode：在保存less文件时，如何自动生成css文件，并且指定css文件的路径？
本文介绍了在VSCODE中使用EasyLESS插件自动生成CSS文件的方法：1）安装EasyLESS插件后，保存LESS文件即可自动生成同名CSS文件；2）通过修改settings.json配置文件中的"less.compile"属性，可自定义CSS文件输出路径。
·
一、自动生成css文件
1、打开VSCODE，点击左侧栏目的【扩展】，在搜索框搜索【Easy LESS】，点击【安装】，如下图所示（ps：我已经安装过了）：
2、安装成功之后，新版本的VSCODE应该不用重启，就可以生效，如果没有生效，重启一下。
在less文件夹里边的index.less文件，引入另外一个base.less文件，然后ctrl+s保存，此时在less文件夹下会多出现一个index.css文件，效果如下图所示，：
二、指定生成的css文件的路径
1、打开VSCODE【扩展】，在搜索框搜索【Easy LESS】，然后点击右下角的【齿轮】按钮，在弹出框中选择【设置】，如下图所示：
2、在新的窗口中，点击【在settings.json中编辑】，如下图所示：
3、在settings.json这个文件中，找到less.compile属性，加入"out": "../css/", 并且保存，注意css文件的位置，如下图所示：
4、此时，再回到index.less中，点击保存，可以看到，index.css文件被保存到css路径下了，如下图所示：
5、删除掉less文件夹里的index.css文件，如下图所示：
腾讯云面向开发者汇聚海量精品云计算使用和开发经验，营造开放的云计算技术生态圈。
更多推荐
8
0- 0
已为社区贡献1条内容
所有评论(0)