标签：文件 less vscode 配置 行数 控制台 css

vscode 配置并使用less 控制台显示less行数

## 安装

• 打开vscode软件中的扩展商店 搜索 easy less

• 点击进行安装
  

• 检测是否安装成功

  • 新建一个后缀为“ .less ”的文件
  • 进行编写随意一些css代码并进行保存
  • 此时 当前less文件下自动生成一个“ .css”的文件既安装成功

配置 实现浏览器中显示 less文件中样式 行数

未配置前控制台显示的为编译后css文件中的样式
为了更好的定位到less 中的样式 进行配置改变控制台显示是提高效率的必然途径

• 首先打开扩展商店点击已安装的扩展（没安可直接搜索）找到 easy less 扩展程序

• 展示的详细页中 右侧的设置 再次点击 扩展设置

• 

• 此时会跳转到设置页面

• 点击 settings.js 跳转到该配置文件中
• 将以下代码进行复制粘贴即可 配置间需要逗号隔开否则报错

"less.compile": {
        "compress": false,//是否压缩
        "sourceMap": true,//是否生成map文件，有了这个可以在调试台看到less行数
        "out": true, // 是否输出css文件，false为不输出
        "outExt": ".css", // 输出文件的后缀

• 如上代码已经列举含义自行开启关闭

• 最后在控制台中查看样式 出现 less样式的行数既配置成功

bye-bye

标签：文件,less,vscode,配置,行数,控制台,css
来源： https://blog.csdn.net/dccose/article/details/122191667

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。