Visual Studio Code 配置 EasyLESS,如果想用less,但又不想在组件中直接添加 style 时可以参考
在用 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 时可以参考的更多相关文章
- Visual Studio Code配置 HTML 开发环境
Visual Studio Code配置 HTML 开发环境 https://v.qq.com/x/page/l0532svf47c.html?spm=a2h0k.11417342.searchres ...
- Visual Studio Code配置GoLang开发环境
Visual Studio Code配置GoLang开发环境 在Visual Studio Code配置GoLang开发环境 作者:chszs,未经博主允许不得转载.经许可的转载需注明作者和博客主页: ...
- Visual Studio Code配置
Visual Studio Code 从1.23.0开始VS Code就不再默认提供各语言版本, 而是改为使用插件的方式提供语言包. 在插件商店搜索Chinese (Simplified), 安装. ...
- Visual Studio Code配置技巧
Visual Studio Code配置技巧 VS Code是啥 Visual Studio Code(以下简称 VS Code) 是一个免费.开源.跨平台的由微软开发的程序编辑器.它是用 TypeS ...
- Visual Studio Code 配置 gcc
作者:谭九鼎链接:https://www.zhihu.com/question/30315894/answer/154979413来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注 ...
- Visual Studio Code 配置C/C++环境
0. 前言 VS Code 是微软发布一款跨平台的源代码编辑器,其拥有强大的功能和丰富的扩展,使之能适合编写许多语言. 本文面向初学者(但不是纯小白),分享一点我配置C/C++的经验. 本文所有内容均 ...
- 最全的Visual Studio Code配置及使用教程
史上最全vscode配置使用教程 工欲善其事,必先利其器.想要优雅且高效的编写代码,必须熟练使用一款前端开发工具.但前端开发工具数不胜数,像HBuilder.Sublime Text.WebStorm ...
- Visual Studio Code 配置指南
Visual Studio Code (简称 VS Code)是由微软研发的一款免费.开源的跨平台文本(代码)编辑器.在我看来它是「一款完美的编辑器」. 本文是有关 VS Code 的特性介绍与配置指 ...
- Visual Studio Code 配置C++环境
Visual Studio Code (简称 VS Code / VSC) 是一款免费开源的现代化轻量级代码编辑器,支持几乎所有主流的开发语言的语法高亮.智能代码补全.自定义热键.括号匹配.代码片段. ...
随机推荐
- 解决npm下载慢的问题
方法一:使用淘宝定制的cnpm命令行工具替代默认安装npm npm install -g cnpm --registry=https://registry.npm.taobao.org 方法二:将np ...
- ABP入门教程1 - 开篇
点这里进入ABP入门教程目录 基于DDD的现代ASP.NET开发框架 - ABP ABP是“ASP.NET Boilerplate Project (ASP.NET样板项目)”的简称. ASP.NET ...
- STL--标准模板库--简要概述
STL--标准模板库 #include <vector> //头文件 STL(Standared Template Library)即标准模板库,惠普实验室开发的一系列软件的统称. ...
- Jackson version is too old 2.xx
我使用的是IDEA,很简单. 切换到project,如果下面的module版本是2.65,上面的jackson.core.xx小于2.65就会报old,如果高于2.65就会报不兼容. 所以调整成相同的 ...
- ubuntu 或centos 使用Docker搭建anaconda+python基本环境
ubuntu 16 使用Docker安装anacondaubuntu docker 安装centos docker 安装搜索可用镜像 docker search anaconda 拉取你中意的镜像 d ...
- June 09th, 2019. Week 24th, Sunday
The beauty you see in me is a reflection of you. 你在我身上看到的美,正是你的倒影. From Jalaluddin Rumi. What we see ...
- 物理像素[设备像素] & 逻辑像素[CSS像素];
为什么移动端CSS里面写了1px,实际上看起来比1px粗 了解设备物理像素和逻辑像素的同学应该很容易理解,其实这两个px的含义其实是不一样的, UI设计师要求的1px是指设备的物理像素1px,而CSS ...
- Django 缓存 cache基本使用
1.设置setting REDIS_HOST = '10.133.3.26' REDIS_POST = 6379 REDIS_DATABASE = 3 REDIS_PASSWORD = '' CACH ...
- java之API初识
API概念 API(Application Programming Interface),应用程序编程接口.JavaAPI是一本程序员的字典 ,是JDK中提供给 我们使用的类的说明文档.这些类将底层的 ...
- 移位寄存器及verilog代码
通用移位寄存器 作用:后续补全 )( :] Data_out, output MSB_out, LSB_out, :] Data_in, input MSB_in, LSB_in, input s0, ...