$ cnpm install @uyun/cli-webpack-less-themes
UED 设计会根据 基础色板,中性色板 设计出一套 标准全局变量,以上变量可以通过 主题管理后台 进行管理。 主题管理后台会生成,less 标准全局变量,存入到 @uyun/everest/styles。 css 标准全局变量,存入到 @uyun/runtime, 并提供接口获取 css 变量。
项目样式文件中必须使用 less 标准全局变量,样式文件中引用的 less 标准全局变量 会在编译的过程中转换成引用 css 标准全局变量,@uyun/runtime 会在项目运行的时候将 css 标准全局变量 插入到 DOM 结构中。
less
标准全局变量使用方式在项目可以直接使用主题管理后台中的 标准全局变量, 无需导入@uyun/everest-styles
。因为变量会在编译的过程中转化成css变量,例: @page-bg => --var(page-bg)
, 所有不会产生 less 编译错误
使用步骤如下:
@uyun/cli-webpack-less-themes
yarn add @uyun/cli-webpack-less-themes
@uyun/cli
脚手架配置文件 everest.config.js
plugins: [
'@uyun/cli-webpack-less-themes'
]
/** @import "~@uyun/everest-styles"; 注意无需导入 @uyun/everest-styles **/
body {
background: @page-bg;
}
Copyright 2013 - present © cnpmjs.org