less使用

1、npm i less --save-dev 把less源码安装到开发环境

/* less文件是通过less.loader.js 来编译成css最后加载到页面中的 */

2、npm i less-loader@6 --save-dev 安装less解析器 (★一定要指定版本)

3、lessc -v 查看版本

4、在main.js  import less from 'less'  Vue.use(less)

5、独立的vue文件需要引入less

less中变量的使用 定义方式:@key:value; 使用方式:@key;

字符串拼接变量使用方式 @img:'./img/'; background:url("@{img}1.png")

写减法的时候左右要加空格,否则会理解为杠-

多层嵌套+变量计算;

   

       

   

混合 = 函数

我是box1

我是box2

运算符

可以对高度、宽度、角度进行计算;

       

  • {{item}}

你可能感兴趣的:(less使用)