covid19
covid19 copied to clipboard
Tokyo-Metro-Gov
[Draft] Feat/vue3+webpack5
👏 解決する issue / Resolved Issues
- close #5463
📝 関連する issue / Related Issues
#6048
⛏ 変更内容 / Details of Changes
-
[email protected]に対応した、アプリの修正 -
Webpack@5に対応した、アプリの修正
📸 スクリーンショット / Screenshots
(Now printing...)
上記に関する他のケースとしては、下記のあたりをご参考にすると良いでしょう。 https://techblog.zozo.com/entry/vue-options-api-to-composition-api
このページにも書いてある、Vue@3+Webpack@5 移行を阻むショーストッパーとして最も大きなものは、Vuetify が未だ Vue@3 非対応という点に尽きます。
私は、よほど Vuetify に PR を出してやろうかとさえ考えています。
特に、Vuetify コンポーネントの中でもけっこう使用頻度の高い <v-icon></v-icon> がらみのところが対象に含まれるため、影響範囲は大きいです。
そうした想定アプローチも含め、こんごは拙速にならないよう進めて参ります
いまだにドラフトです。下手に触ると、本当に火傷しますよ！(笑)
この PR は、今後その役目を終えるであろう webpack@4 + vue@2 から同 5 and 3 にアップグレードする際の、以下の活動を支えるのが目的です、と、勝手に定めました。
別ブランチを切った方が良いという際は、アドバイスをお願いいたします。
- アップグレードにありがちな各種制約事項、あるいはリスクの見極め
- 必要な追加モジュール、あるいは逆に不必要となるモジュールの特定
- 上述の活動からの初版プロトタイプ作成、およびテスト（ユニットレベル）
- テスト中に実施される関連モジュール（
Vue-i18n,Vuetify,Nuxtetc. ）のアップグレードやバグ対応のフォローアップ（デプロイ込み） - 上述関連モジュールのコミュニティへの参加を通じた情報収集と反映
- レビュー履歴管理
- その他、全体を通じた雑用（焼きそばパンの購入、勝馬投票券の購入など）
現在は、上記一覧の真ん中あたりといったところでしょうか。
特に Vuetify は、今のままではまるで動きません。悲しいくらいに動きません。
いちおう Vuetify 3 - Titan というプロジェクトが走っているようなのですけど、どこから素材を取ってくればいいのかさえよくわかりません。
さらに、vue-router なども思いっきり制約を受けてしまっています。
じゃあ、私のところではどうやって動かしているか？ 理屈は簡単ですけど、オレオレ版レトロフィットバージョンを作って動かしています。 その実、たいへんな作業です…。
ですので、主に Vue3 アップグレードを想定した場合に、この手順は Vue2/3 を問わずシステムの可用性や維持管理のスムース化に役立ちそうだな、と思ったものは、この活動からの「気づき」として小ぶりな PR を随時上げていこうと考えています。
じっさいに、この PR の成果として既に申請され受理、マージされた PR もあります。
そうこうしているうちに、あら不思議！あとは Vue だけ乗せ換えればアップグレード完了じゃん！というところまで持っていくのを目標としたいですね
Lock file maintenance #6284 でwebpack@5が入ったみたいなんですけど、どうなんでしょうね...？CIは問題なく通ってますし。 https://github.com/tokyo-metropolitan-gov/covid19/pull/6284/files#diff-51e4f558fae534656963876761c95b83b6ef5da5103c4adef6768219ed76c2deR12007-R12035
@mcdmaster いつもありがとうございます！本日をもって対策サイトを閉鎖し、このリポジトリはアーカイブすることとなりました。それに伴って、こちらのPRをクローズとさせてください 🙇 vue3の移行は私たちの力及ばずでした... 😅 ともあれ、フォローいただき感謝です！