在Less中并没有对数组遍历的原生支持，我们可以通过mixin递归的方式来实现遍历。
1、定义数组元素
1 | @colors: red, green, blue, black; |
2、获取数组元素长度
1 | @length: length(@color); |
在less中遍历数组元素
CSS预处理器中使用Webpack alias配置
在使用 webpack 构建项目时，经常会使用到 resolve.alias 的功能。它可以用来创建 import 或 require 的别名，使得模块引入变得更简单。1
2
3alias: {
'@': 'src/components'
}
现在，可以替换替换原有的导入路径方式：1
2
3
4// before
import component from "src/components/component"
// after
import component from "@/component"
在CSS预处理器的@import中使用alias
@import存在于 css 中，而 css 是由 css-loader 来进行处理的，所以在处理过程中并不能使用 webpack loader 的 alias 配置。下面的引入将不会生效：1
@import "@/reset.css"
使用 ~ 标识符
想要在 css 中使用 alias，可以采用如下解决方案：1
@import "~@/reset.css"
~的作用是告诉 webpack，当前 import 的路径是使用 alias 配置进行导入。
可以点击这里查看该css-loader Issues详情
