私はトークンの設計とシステムの設計の両方に慣れていません。スタイル ディクショナリを使用してデザイン マークアップを SCSS 変数に変換しようとしていますが、変数ファイル内のタイポグラフィ マークアップが [object object] であることが判明したことを除いて、すべてが正常に動作しているようです。何が間違っているのかわかりません。ご協力をいただければ幸いです。以下は私のスタイル辞書の設定ファイルです。
[object object]
私のトークン JSON は
提供されたコードとトークンの JSON ファイルによると、植字値が SCSS 変数に正しく変換されていないようです。
問題は、レイアウト タグでの "value" 属性の設定方法に関連している可能性があります。現時点では、これは文字列ではなくオブジェクトであるため、[object object] として表示されます。 この問題を解決するには、写植変換が解析して必要な SCSS 変数を作成するために使用できる形式の文字列に値を設定する必要があります。
"value"
たとえば、値オブジェクトを単一の文字列に折りたたみます。
以下は、トークンが修復された後の btn-dftypography の例です:
btn-dftypography
以前はこんな感じでした:
注: 他のタイポグラフィ マークにも同様の変更を加える必要があります。
提供されたコードとトークンの JSON ファイルによると、植字値が SCSS 変数に正しく変換されていないようです。
問題は、レイアウト タグでの
"value"
属性の設定方法に関連している可能性があります。現時点では、これは文字列ではなくオブジェクトであるため、[object object]
として表示されます。 この問題を解決するには、写植変換が解析して必要な SCSS 変数を作成するために使用できる形式の文字列に値を設定する必要があります。たとえば、値オブジェクトを単一の文字列に折りたたみます。
以下は、トークンが修復された後の
リーリーbtn-dftypography
の例です:以前はこんな感じでした:
リーリー注: 他のタイポグラフィ マークにも同様の変更を加える必要があります。