mirror of
https://github.com/iczer/vue-antd-admin
synced 2025-04-06 04:00:06 +08:00
90 lines
2.2 KiB
JavaScript
90 lines
2.2 KiB
JavaScript
const {cssResolve} = require('../config/replacer')
|
||
// 修正 webpack-theme-color-replacer 插件提取的 css 结果
|
||
function resolveCss(output, srcArr) {
|
||
let regExps = []
|
||
// 提取 resolve 配置中所有的正则配置
|
||
Object.keys(cssResolve).forEach(key => {
|
||
let isRegExp = false
|
||
let reg = {}
|
||
try {
|
||
reg = eval(key)
|
||
isRegExp = reg instanceof RegExp
|
||
} catch (e) {
|
||
isRegExp = false
|
||
}
|
||
if (isRegExp) {
|
||
regExps.push([reg, cssResolve[key]])
|
||
}
|
||
})
|
||
|
||
// 去重
|
||
srcArr = dropDuplicate(srcArr)
|
||
|
||
// 处理 css
|
||
let outArr = []
|
||
srcArr.forEach(text => {
|
||
// 转换为 css 对象
|
||
let cssObj = parseCssObj(text)
|
||
// 根据selector匹配配置，匹配成功，则按配置处理 css
|
||
if (cssResolve[cssObj.selector]) {
|
||
outArr.push(cssResolve[cssObj.selector].resolve(text, cssObj))
|
||
} else {
|
||
let cssText = ''
|
||
// 匹配不成功，则测试是否有匹配的正则配置，有则按正则对应的配置处理
|
||
for (let regExp of regExps) {
|
||
if (regExp[0].test(cssObj.selector)) {
|
||
let cssCfg = regExp[1]
|
||
cssText = cssCfg ? cssCfg.resolve(text, cssObj) : ''
|
||
break
|
||
}
|
||
// 未匹配到正则，则设置 cssText 为默认的 css（即不处理）
|
||
cssText = text
|
||
}
|
||
if (cssText != '') {
|
||
outArr.push(cssText)
|
||
}
|
||
}
|
||
})
|
||
output = outArr.join('\n')
|
||
return output
|
||
}
|
||
|
||
// 数组去重
|
||
function dropDuplicate(arr) {
|
||
let map = {}
|
||
let r = []
|
||
for (let s of arr) {
|
||
if (!map[s]) {
|
||
r.push(s)
|
||
map[s] = 1
|
||
}
|
||
}
|
||
return r
|
||
}
|
||
|
||
/**
|
||
* 从字符串解析 css 对象
|
||
* @param cssText
|
||
* @returns {{
|
||
* name: String,
|
||
* rules: Array[String],
|
||
* toText: function
|
||
* }}
|
||
*/
|
||
function parseCssObj(cssText) {
|
||
let css = {}
|
||
const ruleIndex = cssText.indexOf('{')
|
||
css.selector = cssText.substring(0, ruleIndex)
|
||
const ruleBody = cssText.substring(ruleIndex + 1, cssText.length - 1)
|
||
const rules = ruleBody.split(';')
|
||
css.rules = rules
|
||
css.toText = function () {
|
||
let body = ''
|
||
this.rules.forEach(item => {body += item + ';'})
|
||
return `${this.selector}{${body}}`
|
||
}
|
||
return css
|
||
}
|
||
|
||
module.exports = {resolveCss}
|