Web-componentを使用したエンタープライズ・コンポーネント・ライブラリの構築

コンポーネントライブラリの現状
フロントエンドの現在の主流のフレームワークはreact,vuejs,angularなどである.
通常、ant-designはreactベースのUIコンポーネントライブラリであり、elementUIはvuejsベースのコンポーネントライブラリであるなど、コンポーネントライブラリを構築するときは、あるフレームワークに基づいて構築されます.
現在、コミュニティにはvuejsコンポーネントがreactコンポーネントに変換されるなど、フレームワーク間の変換サービスを提供するツールがあります.しかし、結局は異なるフレームワークであり、異なる基準がある.そのため、フレームワークapiが変動すると、変換ロジックを書き換える必要があります.明らかに柔軟ではありません.そのため、この状況については議論しません.
会社としては、論理は同じですが、異なるフレームワークに異なるコンポーネントライブラリを書く必要があります.
また、フレームワークがアップグレードされる場合、例えば1.xを2にアップグレードxは、対応するコンポーネントライブラリをアップグレードする必要があります.会社のコンポーネントライブラリがたくさんある場合(vuejs、react、angularなど)、このアップグレードの確率はもっと大きくなります.
Web-componentとは?
では、もっと良い案はありませんか.一度に書いて、あちこちで使っていますか.
答えはweb componentを借りることです.
Web Componentsは、開発者が多重化可能なコンポーネントを作成できるように、w3cのHTMLとDOMを追加した一連の特性です.
Web componentsはw 3 c組織によって推進されるため、近い将来ブラウザの標準化になる可能性が高い.
Web Componentsは主に以下の4つの部分から構成されています.

Custom Elements–新しいhtml要素を定義するapi

Shadow DOM – Encapsulated DOM and styling, with composition

HTML Imports – Declarative methods of importing HTML documents into other documents

HTML Templates–The