首页 > 其他 > 详细

Visual Studio Code 配置 EasyLESS,如果想用less,但又不想在组件中直接添加 style 时可以参考

时间:2019-05-16 10:08:46      阅读:3050      评论:0      收藏:0      [点我收藏+]

在用 vue 画页面时,如果想用less,但又不想在组件中直接添加 style ,可以使用 vs code 的插件:EasyLess

EasyLess 安装好后必须在 setting.json 中对它进行配置。如果使用默认配置,在编写 less 后,会自动在根目录编译生成多个以 less 命名的 css 文件。一个项目中是不需要加载不同的 css 文件的,可以把所有的组件样式合并为一个 css 文件,比如下面这样的:

技术分享图片

可以将不同组件的样式以不同的 less 文件进行编辑,最后生成一个 app.css 文件,然后在项目的 index.html 中加载。

如果哪个组件的布局或样式有变化,可以直接在 less 文件夹中找到对应组件的 less 文件进行修改。

EasyLESS 的配置文件为:

    "less.compile": {
        "out": "../css/app.css", //定义好输出的文件路径
        "sourceMap": false,
        "compress": true,
        "autoprefixer": "> 5%, last 2 Chrome versions, not ie 6-9"
    },

完毕。

Visual Studio Code 配置 EasyLESS,如果想用less,但又不想在组件中直接添加 style 时可以参考

原文:https://www.cnblogs.com/baiyygynui/p/10873810.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!