zoukankan      html  css  js  c++  java
  • vscode如何将less编译到指定css目录中

    首先使用vscode的搬砖猿,想要在vscode编辑器里面很方便的编译less文件,需要在扩展商店里面下载一款名叫Esay LESS的超好用扩展(我自己都不信),哈哈,其实还好。 安装完扩展之后,最好点击一下重载以启用,为了后面更好的使用这个扩展,其他的扩展也都是重载后使用更佳。。。  

    想要配置这些扩展,而且仅仅是在当前这个项目中配置,需要在当前项目中(以任意方式)生成一个.vscode的配置文件夹,我们常用的配置都可在这个文件夹生成文件进行配置。

    好吧,接着配置我们的LESS,我们需要在.vscode文件夹中建立一个settings.json的文件。输入一下配置信息:

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

      

    这是Easy LESS扩展说明里面给出的,最简单的仅仅配置编译后css文件储存位置的配置信息。

    字由https://www.wode007.com/sites/73248.html 中国字体设计网https://www.wode007.com/sites/73245.html

    注意一下

    我自己在使用上面的配置信息时,遇到了几个问题,

    第一次使用的时候,我将.vscode放在了自己的项目目录中,但是我工作区中很多其他项目(文件夹而已),这时的配置并没有生效,我当时的做法是,单独仅仅使用vscode打开了这一个项目,就好了。 

    还有,我们使用上面的配置信息,很轻易的就可以把编译过后的css文件输出储存到根目录下的css文件夹中,但是我想要储存到其他嵌套多级的文件夹中的时候,需要==注意==

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

      

    第一次我这样写,输出到了css文件夹下的users.css文件中,尴尬。。。就是说,想生成到对应的目录下,需要在路径后加上\标识这是个文件夹。所以正确的写法是:

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

      

    如果我踩到了很多坑,那我就在坑里游游泳。  

  • 相关阅读:
    git错误操作导致代码丢失找回
    org.apache.ibatis.binding.BindingException: Invalid bound statement (not found)问题
    WebMvcConfigurerAdapter在Spring boot2.x已废弃
    AJAX实现模拟注册跳转
    遍历字符串替换实例
    spring boot2.x依赖
    Thymeleaf页面添加th:value后报错原因
    thymeleaf中th:href字符拼接
    刁肥宅数据结构课设“布隆过滤器的实现和应用”源代码(v1.0,永不上交)
    数据结构实验1:C++实现静态顺序表类
  • 原文地址:https://www.cnblogs.com/ypppt/p/13331022.html
Copyright © 2011-2022 走看看