vue3引入全局less Variables和Mixins

一、首先在src/less文件夹下新建variables.less和mixins.less两个文件

1、variables.less文件

@primary: red;
@bg: blue;
.tt-test {
  color: @primary;
  background-color: @bg;
}

2、mixins.less文件

/**
 * @description: 文本溢出（多行）
 * @param {number} lineNumber 文本溢出的行数
 */
.more(@lineNumber: 2) {
  display: -webkit-box !important;
  overflow: hidden;
  text-overflow: ellipsis;
  work-break: break-all;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: @lineNumber; //指定行数
}

二、引入全局Variables

1、在main.js中直接引入variables.less文件，注意variables.less文件中不能包含函数式的mixins，因为不会起作用。但是可以在标签中添加class="tt-test"使用variables.less文件中的tt-test样式。

// 自定义样式
import './less/reset.less'

2、在