js 中无法直接获取scss变量，但是js可以获取css变量

• 但是js可以获取css变量，于是我转换了一次，指定导出功能
• 注意：如果直接 --layout-header-height: $layout-header-height; 最后会得到一个 $layout-header-height 的字符串，所以需要 #{} 包裹

// 全局变量添加
$layout-header-height: 70px;

// 需要被导出到css的变量，可以被js获取
// 如果不用 #{} 包裹，会获取到一个  $layout-header-height 的字符串，非变量
:root {
  --layout-header-height: #{$layout-header-height};
}

调用方法

/**
 * @name: 获取root中变量的值, 默认返回数字类型
 * @param {string} key root中存在的变量名称
 */
export function getRootCssByKey(key: string): number {
  const rootStyles = getComputedStyle(document.documentElement)

  //   key -- --layout-header-height
  const keyStr = rootStyles.getPropertyValue(key)
  // 将字符串值转换为数字（假设单位是px）
  const keyValue = parseInt(keyStr, 10)

  return keyValue
}

结果

const LAYOUT_HEADER_HEIGHT = getRootCssByKey('--layout-header-height')
    console.log('LAYOUT_HEADER_HEIGHT', LAYOUT_HEADER_HEIGHT) // --> LAYOUT_HEADER_HEIGHT 70
    ```