操作ガイド

デザインシステム管理(DSM)を開く

デザインシステム管理(DSM)は、公開済みライブラリのリソースをまとめて扱うための機能です。デザイン素材を確認し、開発で使うコンポーネント名との対応を整理できます。

DSMを開く

公開済みのライブラリファイルを用意します。次のいずれかの場所からDSMを開けます。

  • エディターのファイル名のメニューでDesign System Modeを選択します。
  • チームのResourcesでOpen in Design Systemを選択します。
  • エディターのライブラリ一覧でOpen Design Systemを選択します。

DSMはデザインモードで開きます。設定の編集には編集権限が必要です。

別名を設定する

DSMでスタイル、コンポーネント、変数を探し、コード側の名称に対応する別名を設定します。デザインと実装で既に名前が一致している場合は、別名の設定は不要です。

コンポーネントの対応関係を設定する

Code Parsingを開き、コンポーネントのインスタンスとコード側のコンポーネントの対応を設定します。パーサーを使うと、例えばデザイン内のButtonを、プロジェクトのel-buttonに関連付け、プロパティや内容も指定できます。

設定項目と例は、コンポーネントパーサーのリファレンス(英語)を参照してください。入口と別名の設定は、DSM開発者ガイド(英語)で確認できます。

D2C⁺で対応関係を使う

D2C⁺にはEnterprise Full-feature SeatまたはDev Seatと、エンタープライズスペース内のファイルが必要です。コンポーネントライブラリとの対応付けは任意です。デザインのコンポーネントをプロジェクトのライブラリに結び付ける必要がなければ、設定せずにコードを生成できます。

生成手順と設定方法は、D2C⁺クイックスタート(英語)を参照してください。