Adobe XDでアセットをSCSS用に変数とmixinを書き出すプラグインを開発する - Qiitaはじめに AdobeXDを使ってデザインを作ってると「アセットをこのままCSSに書き出せたらなぁ」って一度は思いますよね。自分は思いました。 2019年5月のアップデートで今までの「シンボル」の概念から「コンポーネント」という概念に変わり、よりコンポーネントの扱いが便利になりました。 今回はAdobeXDで登録したカラーアセットとフォントスタイルをSCSSで使える変数やmixinに書き出すプラグインを作ってみました。 動作は下の動画のようになります。 開発環境 AdobeXDのプラグインはES2018で開発ができます。 今回はTypeScriptで開発をしました。 理由はいくつかあるのですが、大きな理由としてAdobe公式の型定義ファイルが用意されているのでコード補完が効くという点があります。かなり独自のクラスが多いのでTypeScriptで開発をすることをおすすめします。 また、今回はダ
