Mui

背景 mirador-annotations は、IIIF ビューア Mirador にアノテーション機能を追加するプラグインです。 従来のプロジェクトは以下の構成でした： ビルドツール : nwb (Create React App ベース) UI ライブラリ : Material-UI v4 Mirador : 3.x React : 17.x しかし、以下の問題が発生していました： nwb のメンテナンス停止 - nwb は長期間更新されておらず、依存関係の競合が頻発 npm install の失敗 - 古い依存関係により、新しい環境でのセットアップが困難に セキュリティ脆弱性 - 古いパッケージに多数の脆弱性警告 これらの問題を解決するため、以下への移行を決定しました： ビルドツール : Vite UI ライブラリ : MUI v7 Mirador : 4.x React : 18.x 移行作業の概要 1. ビルドツールの移行 (nwb → Vite) nwb の設定ファイルを削除し、vite.config.js を新規作成しました。 主なポイント： e } x ) p c r } ; v o o e ; i r n t d } r } t t s u e , e , e t r f g s d ] . d n d i l 重 o e , c e e r n o 複 l d ' ' ' ' o f n { a e b パ v u @ @ r r n a v f : a ッ e p e e e e f u t l ケ : e m m a a i l = - { : ー : o o c c g t j ジ { t t t t . l s ' の [ i i ' - j d o g 解 o o , d s e a が l 決 n n o f d o / / m i E g b r s ' n n l a e t , e v o l a y C ( b T c l o m a h t e n o l i ' d f d s , ' i e を ' , g , 参 , ( 照 ( p す { r る o た m c め o e d s e s . } c ) w d = ( > ) , { ) ; 2. Material-UI の移行 (v4 → v7) @material-ui/* を @mui/* に変更 makeStyles を sx prop に置き換え Grid コンポーネントの API 変更に対応 (item と xs props が size に統合) < < G G r r 変 i 変 i 更 d 更 d 前 後 i s ( t ( i M e M z U m U e I I = x { v s v 1 4 = 7 2 ) { ) } 1 > 2 } > 3. Mirador 4.x への対応 Mirador 4.x では、アクションやセレクターのインポート方法が変更されました： ...