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] != undefined) { let cfg = cssResolve[cssObj.selector] if (cfg) { outArr.push(cfg.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}