DesignOps推進の一環としてFigma上のコンポーネントを自動でnpmにpublishしてみる

DesignOpsとは DesignOpsとは質の高いデザインのアウトプットの維持を支えるための仕組みづくりのことです。 この仕組みを整えることでデザイナーもエンジニアもお互いストレスなくそれぞれの仕事に専念できます。 今回は、デザイナーがデザインツールのFigma上で作成したアイコンをReactコンポーネントに変換してnpmに定期的にpublishするところまでを自動化しました。この自動化により、わざわざFigmaにみに行って、デザインされたsvgを切り出しReactコンポーネントに変換して利用するという作業が不要になりました。Figama上でアイコンが更新されたら、新たにnpm installするだけでアイコンを取り込んで使うことができるようになります。 js側では、以下のような雰囲気でnpmからアイコンコンポーネントを利用可能です。 import { MenuClose } from

[efcl]

Figmaからアイコンをnpmパッケージとして作成