LASSIC Media らしくメディア
Vue2からVue3への移行で外注前に確認したい5つのポイント
監修・編集責任者：牛尾 昭昌（株式会社LASSIC 執行役員）
この記事の結論
- Vue2は2023年12月31日にサポートが終わり、セキュリティの修正も届かなくなりました。
- Vue3への移行、Reactへの切り替え、Vue2.7で使い続けるの3つから、今後の機能追加の予定で選びます。
- 外注の前に、使っているライブラリの調査と移行後の保守の担当を決めておくと進めやすくなります。
※ 本記事は2026年11月時点の公式情報（省庁・公的機関、および製品やサービスを提供する事業者が公開している資料）に基づきます。
Vue2で作った社内システムが今も動いている。サポートが終わったと聞いたものの、Vue3に上げるべきか、いっそReactで作り直すべきか決められない——。Vue2の時代に画面を作った会社では、こうした迷いが起こりがちです。Vue2からVue3への移行とは、サポートの終わったVue2で作った画面を、今の標準の版であるVue3で動くように書き換える作業を指します。
ただし移行は万能ではなく、使っているライブラリによっては手間が大きく、Reactへの切り替えやVue2のまま使い続ける道が合う場合もあります。本記事では、Vue2のシステムを抱える情報システムの担当者に向けて、サポート終了の中身、Vue3とReactの選び方、移行の進め方、そして外注する前に確認したい5つの点を整理します。
目次
Vue2のサポート終了とは
Vue.jsの公式サイトによると、Vue2は2023年12月31日にサポート終了を迎えました。*1 それ以降は更新も修正も出ていませんが、配布は続いているため、動いているシステムが止まったわけではありません。
- 最後の版はVue2.7.16で、公式はまずこの版へ上げることを強く勧めています*1
- Vue2.7は2022年7月1日の公開から18か月の長期サポート（LTS）を受け、その終わりがサポート終了の日でした*2
- サポート終了の後は、セキュリティの修正もブラウザへの対応の修正も届きません
- Vue3は2022年2月7日からVue.jsの標準の版になっています*1
公式は、Vue2に実際の脆弱性はほとんど無かったとしつつ、規則や社内の方針でサポート中の版が求められる場合や、SLA（サービス品質の取り決め）を結んで顧客に納めるシステムでは、サポートの終わったソフトを含めないほうがよいと説明しています。*2 自社のシステムがどちらに当たるかで、移行を急ぐかどうかが変わります。
Vue3とReactのどちらへ移るか
Vue2のシステムを抱えたときの選択肢は、大きく3つあります。公式は、Vue3には互換性のない変更があり移行には手間がかかる一方、使い方の大半は2つの版で共通なので、Vue2の知識の多くはVue3でもそのまま役に立つとしています。
| 選択肢 | 中身 | 向いている場面 |
|---|---|---|
| Vue2.7に上げて使い続ける | 最後の版に上げる。必要なら公式が案内する有償の延長サポートを使う | 安定して動いていて、大きな機能追加の予定が無いとき |
| Vue3へ移行する | 公式の移行の手引きと移行ビルドを使い、画面を順に書き換える | 今後も機能追加を続ける予定があり、Vueの作り手を確保できるとき |
| Reactへ移る | 新しい画面からReactで作り、古い画面を順に置き換える | 社内のほかのシステムがReactで、作り手や保守の体制をそろえたいとき |
Reactへ移る場合も、一度に全部を作り直す必要はありません。Reactの公式ドキュメントは、今あるサイトのうち特定のURLから下だけをReactで作る方法や、ページの一部にReactの部品を置く方法を紹介しています。*5 ただし、画面の作り直しにかかる手間は、Vue3への移行の見積もりと並べて比べておきます。
どれを選ぶかは、公式が挙げる問いに答えてから決めます。今のシステムは安定して動いているか、今後も機能を追加するか、移行でしか解けない困りごとがあるか——の3つです。*2
Vue3への移行の進め方
Vue3への移行は、公式の移行の手引きにそって4つの段階で進めます。要になるのは移行ビルド（Vue2の書き方のまま動かせるVue3の特別な版）です。Vue3で変わった機能や廃止された機能を使っている箇所を、動かしたときの警告で知らせてくれます。*3
- ステップ1：使っている部品のライブラリ、対応するブラウザ、サーバー側で画面を作る仕組みの有無を書き出す
- ステップ2：Vue2.7.16に上げて、古い書き方を先に直しておく
- ステップ3：移行ビルドでシステムを動かし、警告を1つずつ消していく
- ステップ4：通常のVue3に切り替え、周りの道具も新しい推奨に合わせる
周りの道具も、公式の推奨が変わっています。画面の状態をまとめて持つ仕組みはVuexからPiniaへ、開発に使う道具はVue CLIからViteへ移り、画面の切り替えを受け持つVue Routerも新しい版になりました。*4 本体の書き換えとは別の作業なので、見積もりでは分けて数えておきます。
つまずきやすい点
公式は、大きく複雑なシステムでは移行ビルドを使っても移行は難しい作業になると注意を促しています。移行ビルドの手引きが挙げる、移りにくい主な場合は次のとおりです。
- Vue2の内部の仕組みや、文書に書かれていない動きに頼ったライブラリを使っている
- 画面の部品集（Vuetify・Quasar・Element UIなど）を使っている。公式は、こうした部品集がVue3に対応するまで待つのがよいとしています
- Internet Explorer 11への対応が必要。Vue3は対応しないため、Vue2に留まることになります
- サーバー側で画面を作る仕組みを自前で組んでいる
Nuxt（Vueでサイト全体を組むための枠組み）で作ったシステムも確認が要ります。Nuxt2は2024年6月30日にサポートが終わり、それ以降はセキュリティやブラウザへの対応の修正を受けられなくなりました。*6 同じようにサポートが終わった枠組みの移行は、AngularJSサポート終了後の移行でも扱っています。
外注する前に確認しておきたい5つの点
Vue2からVue3への移行を外部に頼むときは、見積もりを取る前に次の5つを確かめておくと、話が食い違いにくくなります。公式も、移行するかどうかを決める正確な計算式は示せないとしたうえで、最初に調べる時間を取って手間を見積もるよう勧めています。
- 現状の調査：使っているライブラリと、Vue2特有の動きに頼った箇所を洗い出す作業を、本体の見積もりの前に切り出して頼めるか
- 移る先の決め方：Vue3への移行、Reactへの切り替え、Vue2のまま使い続ける、のどれを勧めるか。その理由を説明してもらえるか
- 検証のやり方：移行の前と後で、画面ごとの動きをどう見比べるか。自動のテストが無ければ誰が作るか
- 部品集の置き換え：Vue3に対応した版が無い部品をどう扱うか。置き換えの作業が見積もりに入っているか
- 移行後の保守：Vue3やNuxtの更新に、移行の後も誰がどの頻度で追いつくか
公式は、今後はVue2からVue3のような大きな書き換えを避ける方針を示していますが、機能を加えた版は3〜6か月ほどの間隔で出ています。*7 移行後の保守まで同じ委託先に頼むのか、社内で受け持つのかを先に決めておきます。作り手を社内で確保しにくい場合は、Vue.jsエンジニア不足を受託・委託で補完する進め方で扱っています。
まとめ：Vue2からVue3への移行で確かめておきたい3つの点
Vue2からVue3への移行を判断するうえで、確かめておきたい点は3つに整理できます。第一に、自社のシステムが規則や顧客との取り決めでサポート中の版を求められるかを確かめること。第二に、Vue3への移行、Reactへの切り替え、Vue2のまま使い続けるのどれにするかを、今後の機能追加の予定と使っているライブラリから決めること。第三に、移行ビルドで動かす前に現状を調べ、移行後の保守の担当まで決めておくことです。この3点を踏まえておけば、「移行を始めてから、使っていた部品集がVue3で動かないと分かった」という事態を避けやすくなります。進め方に迷いがあれば、外部の手を借りるのも一つの選択肢です。
よくある質問
Vue2のまま使い続けると、システムは動かなくなりますか
すぐに動かなくなるわけではありません。Vue2はサポート終了の後も、これまでの配布の経路から入手できます。ただし、セキュリティの修正やブラウザへの対応の修正は届かないため、使い続けるなら少なくともVue2.7に上げておくよう公式は勧めています。
移行の費用や期間は、どう見積もればよいですか
公式も、移行するかどうかを決める正確な計算式は示せないとしています。使っているライブラリがVue3に対応しているか、Vue2とVue3で変わった動きにどれだけ頼っているか、担当者が移行に時間を割けるかを先に調べ、その結果をもとに見積もってもらうのが確実です。
移行の途中でも、本番のシステムを動かし続けられますか
移行ビルドで動くところまで進めば、移行が終わる前でも本番で使えると公式は説明しています。*3 わずかに重くなるものの、利用者が気づくほどではないとされています。ただし、通常のVue3へ切り替える時期の予定も立てておきます。
Vue2からの移行のご相談
Vue2で動くシステムの現状調査から、Vue3への移行やReactへの切り替えの判断、移行後の保守まで、元請（プライムベンダー）としてご提案します。
2006年の創業以来、一次請けのシステムインテグレーターとして、企業のシステム開発と保守・運用を受託してきました。
出典
- *1 参考：Vue.js「Vue 2 Has Reached End of Life」（https://v2.vuejs.org/eol/）。出典：Vue2のサポート終了日（2023年12月31日）、終了後も既存の経路で配布が続くこと、最終版2.7.16への更新の推奨、Vue3が2022年2月7日から標準の版であることの記述を参照（2026年11月確認）
- *2 参考：Vue.js「Vue 2 LTS, EOL & Extended Support」（https://v2.vuejs.org/lts/）。出典：Vue2.7の18か月の長期サポート（2022年7月1日から）、終了後に届かない修正、移行するかどうかの判断の問い、知識の多くがVue3でも使えること、セキュリティとコンプライアンスの考え方の記述を参照（2026年11月確認）
- *3 参考：Vue 3 Migration Guide「Migration Build」（https://v3-migration.vuejs.org/migration-build.html）。出典：移行ビルドの警告、既知の制約（内部の仕組みに頼るライブラリ、部品集、IE11、SSR）、本番での利用についての記述を参照（2026年11月確認）
- *4 参考：Vue 3 Migration Guide「New Framework-level Recommendations」（https://v3-migration.vuejs.org/recommendations.html）。出典：Vue CLIからVite、VuexからPinia、Vue Routerの新しい版への推奨の変更を参照（2026年11月確認）
- *5 参考：React「Add React to an Existing Project」（https://react.dev/learn/add-react-to-an-existing-project）。出典：既存のサイトの特定のURL以下やページの一部にReactを加える方法の記述を参照（2026年11月確認）
- *6 参考：Nuxt「Nuxt 2 End-of-Life (EOL)」（https://nuxt.com/blog/nuxt2-eol）。出典：Nuxt2のサポート終了日（2024年6月30日）と、終了後に届かない修正の記述を参照（2026年11月確認）
- *7 参考：Vue.js「Releases」（https://vuejs.org/about/releases.html）。出典：機能を加えた版（マイナーリリース）の間隔の記述を参照（2026年11月確認）
