标签: design-tokens

我有与此线程完全相同的问题：使用样式字典从设计令牌 json 文件中获取 scss。这个线程中提到的答案很好，但是有没有办法指定一些设置，以便样式字典自动将样式对象转换为上述线程中答案中提到的方式？

我基本上想转换

"Display-2xl": {
    "Regular": {
      "value": {
        "fontFamily": "{fontFamilies.inter.value}",
        "fontWeight": "{fontWeights.inter-0.value}",
        "fontSize": "$fontSize.10",
      },
      "type": "typography"
    },
}

到

"Display-2xl": {
    "Regular": {
      "type": "typography",
      "fontFamily": {
        "value": "{fontFamilies.inter.value}"
      },
      "fontWeight": {
        "value": "{fontWeights.inter-0.value}"
      },
      "fontSize": {
        "value": "{fontSize.10}"
      }
    }
  }

通过添加一些格式/转换。我怎样才能实现这个目标？

我的 config.json 对象：

const StyleDictionary = require("style-dictionary").extend({
  source: ["./tokens.json"],
  platforms: {
    scss: {
      transformGroup: "scss",
      buildPath: "src/tokens/",
      files: [
        {
          destination: "_colors.scss",
          format: "scss/variables",
          filter: {
            type: "color",
          },
        },
        { …