From 376eac8d25d29df211254b53bd7949e414e83327 Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Sat, 28 Feb 2026 10:51:02 +0000 Subject: [PATCH 1/2] Initial plan From ab97341bafba0a3380aebd155f6a759fd949ef28 Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Sat, 28 Feb 2026 10:58:01 +0000 Subject: [PATCH 2/2] fix: code review fixes - extract convertCssVarFormat to utils, fix typo, remove dead code Co-authored-by: CommanderXL <9695264+CommanderXL@users.noreply.github.com> --- example/app.ts | 1 - .../compiler/compile-base-css-variables-md.ts | 14 +---------- .../compile-components-css-variables-md.ts | 23 ++++--------------- .../src/compiler/compile-doc-md.ts | 4 ++-- packages/website-build/src/utils/index.ts | 13 +++++++++++ 5 files changed, 20 insertions(+), 35 deletions(-) diff --git a/example/app.ts b/example/app.ts index 5943846d..e676222f 100644 --- a/example/app.ts +++ b/example/app.ts @@ -18,7 +18,6 @@ configProvider({ }) // app.js -// 触发 main 分支 docs 更新 23 createApp({}) if (isIframe) { diff --git a/packages/website-build/src/compiler/compile-base-css-variables-md.ts b/packages/website-build/src/compiler/compile-base-css-variables-md.ts index ad0169e7..0002fdcc 100644 --- a/packages/website-build/src/compiler/compile-base-css-variables-md.ts +++ b/packages/website-build/src/compiler/compile-base-css-variables-md.ts @@ -6,7 +6,7 @@ import { CACHE_DIR_NAME } from '../common/constant.js' import { createRequire } from 'node:module' import { fileURLToPath } from 'node:url' import { dirname } from 'node:path' -import { readFileSync } from '../utils/index.js' +import { readFileSync, convertCssVarFormat } from '../utils/index.js' const require = createRequire(import.meta.url) const __dirname = dirname(fileURLToPath(import.meta.url)) @@ -20,18 +20,6 @@ const filepath = path.join(outPath, fileName) const startTag = '' const endTag = '' -/** - * 转换CSS变量格式：$var($) -> var(--cube-), $var() -> var(--cube-), $ -> --cube- - * @param origin 原始变量字符串 - * @returns 转换后的CSS变量字符串 - */ -const convertCssVarFormat = (origin: string): string => { - return origin - .replace(/\$var\(\$(.+)\)/g, 'var(--cube-$1)') - .replace(/\$var\((.+)\)/g, 'var(--cube-$1)') - .replace(/\$(.+)/g, '--cube-$1') -} - /** * 生成全局CSS变量文档 * @returns {void} diff --git a/packages/website-build/src/compiler/compile-components-css-variables-md.ts b/packages/website-build/src/compiler/compile-components-css-variables-md.ts index 364be9ae..0688d7d7 100644 --- a/packages/website-build/src/compiler/compile-components-css-variables-md.ts +++ b/packages/website-build/src/compiler/compile-components-css-variables-md.ts @@ -2,27 +2,16 @@ import { Render } from '@mpxjs/vuese-markdown-render' import { renderOptions } from '../common/options.js' import { CACHE_DIR_NAME } from '../common/constant.js' import { createRequire } from 'node:module' +import { convertCssVarFormat } from '../utils/index.js' const require = createRequire(import.meta.url) -/** - * 转换CSS变量格式：$var($) -> var(--cube-), $var() -> var(--cube-), $ -> --cube- - * @param origin 原始变量字符串 - * @returns 转换后的CSS变量字符串 - */ -const convertCssVarFormat = (origin: string): string => { - return origin - .replace(/\$var\(\$(.+)\)/g, 'var(--cube-$1)') - .replace(/\$var\((.+)\)/g, 'var(--cube-$1)') - .replace(/\$(.+)/g, '--cube-$1') -} - /** * 生成组件CSS变量文档 * @param {string} component * @returns {string} */ -const genCompnentsCSSVariablesMd = function (component: string) { +const genComponentsCSSVariablesMd = function (component: string) { const themeVarInfo = require(`../../${CACHE_DIR_NAME}/theme-var-info.json`) const defaultThemeStyle = require(`../../${CACHE_DIR_NAME}/default-theme-style.json`) @@ -71,7 +60,7 @@ const genCompnentsCSSVariablesMd = function (component: string) { // 变量默认值 const contentList = value.split(/\s/) // 正则数组顺序应由具体到抽象，目前为$var($color),$var(color),$color - const regexpList = [/\$var\(\$(.+)\)/, /\$var\((.+)\)/, /\$(.+)/, /\$\(,/] + const regexpList = [/\$var\(\$(.+)\)/, /\$var\((.+)\)/, /\$(.+)/] const handledList = contentList.map(content => { // 引用变量则处理文本为跳转链接 if (content.includes('$')) { @@ -83,7 +72,6 @@ const genCompnentsCSSVariablesMd = function (component: string) { const varName = matchText.startsWith('$') ? matchText.slice(1) : matchText if (BASE_CSS_VARIABLES_MAP.has(varName)) { // 全局CSS变量 - // return `${origin}` return ` ${convertCssVarFormat(origin)} ` } else if (SELF_CSS_VARIABLES_MAP.has(varName)) { // 自身CSS变量 @@ -91,9 +79,6 @@ const genCompnentsCSSVariablesMd = function (component: string) { } else { // 默认为其他同类组件CSS变量 return `${convertCssVarFormat(origin)}` - // const ComponentAlias = varName.split('-')[0] - // return `${origin}` - // return `${origin}` } }) } @@ -114,4 +99,4 @@ const genCompnentsCSSVariablesMd = function (component: string) { return code } -export default genCompnentsCSSVariablesMd +export default genComponentsCSSVariablesMd diff --git a/packages/website-build/src/compiler/compile-doc-md.ts b/packages/website-build/src/compiler/compile-doc-md.ts index ad898af6..58942f07 100644 --- a/packages/website-build/src/compiler/compile-doc-md.ts +++ b/packages/website-build/src/compiler/compile-doc-md.ts @@ -5,7 +5,7 @@ import { getMixinsConfig } from '../utils/get-mixins-config.js' import { camelize, mkdirSync } from '../utils/index.js' import genSrcCodeMd from './compile-src-code-md.js' import genExampleMd from './compile-example-md.js' -import genCompnentsCSSVariablesMd from './compile-components-css-variables-md.js' +import genComponentsCSSVariablesMd from './compile-components-css-variables-md.js' import genBaseCSSVariablesMd from './compile-base-css-variables-md.js' const reg = /([\s\S]+?)<\/card>/g @@ -43,7 +43,7 @@ const genDocMd = ( mkdirSync(path.resolve(mdDistDir, componentGroupName), componentGroupName) const exampleDocPath = path.resolve(mdDistDir, componentGroupName, `${example}.md`) const srcCodeMd = genSrcCodeMd(srcDir, example, fnMixins) - const cssVariablesMdContent = genCompnentsCSSVariablesMd(example) + const cssVariablesMdContent = genComponentsCSSVariablesMd(example) let srcCodeMdContent = '' if (srcCodeMd) { srcCodeMdContent = addCardWrap(srcCodeMd.content + cssVariablesMdContent, '##') diff --git a/packages/website-build/src/utils/index.ts b/packages/website-build/src/utils/index.ts index 7cdc367c..44cb9cf4 100644 --- a/packages/website-build/src/utils/index.ts +++ b/packages/website-build/src/utils/index.ts @@ -89,6 +89,18 @@ const delEmptyContentLineBreaks = function (content) { return content } +/** + * 转换CSS变量格式：$var($) -> var(--cube-), $var() -> var(--cube-), $ -> --cube- + * @param origin 原始变量字符串 + * @returns 转换后的CSS变量字符串 + */ +const convertCssVarFormat = (origin: string): string => { + return origin + .replace(/\$var\(\$(.+)\)/g, 'var(--cube-$1)') + .replace(/\$var\((.+)\)/g, 'var(--cube-$1)') + .replace(/\$(.+)/g, '--cube-$1') +} + export { camelize, isMpxFile, @@ -96,6 +108,7 @@ export { capitalize, readFileSync, trimLineBreak, + convertCssVarFormat, delScriptJsonBlock, getExamplesMpxFiles, delEmptyContentLineBreaks