NOTE 027 / 2019年
ページごとの HTML に、部分だけを足す
ページごとに HTML を返す構成で、Vue を部分導入する方法です。
MPA の構成では、ページごとに HTML が用意されています。すべてを Vue で作るのではなく、状態を持つ部分だけをマウントすると、既存の資産を活かせます。
ビルドの設定では、どのファイルを入口にするか、共通の依存をどう分けるかを決めます。ページごとに別のバンドルを作ると、読み込みは軽くなりますが、共通部分の管理が必要になります。
押さえたい点
- 01状態を持つ部分だけをマウントする
- 02入口ファイルを決める
- 03共通依存の分け方を決める
参考資料
外部サイトが開きます。内容は各サイトの管理下にあります。
- CakePHP ドキュメント 外部サイトbook.cakephp.org
- CakePHP 4 ガイド 外部サイトbook.cakephp.org
- Vue.js ガイド 外部サイトvuejs.org
- Vite ガイド 外部サイトvitejs.dev
- TypeScript ドキュメント 外部サイトtypescriptlang.org
- Vue.js API 外部サイトvuejs.org
- Vue のリアクティブ基礎 外部サイトvuejs.org
- Vue コンポーネント基礎 外部サイトvuejs.org
- Vue Transition 外部サイトvuejs.org
- MDN Web Docs 外部サイトdeveloper.mozilla.org
- web.dev 外部サイトweb.dev
- W3C WAI 外部サイトw3.org
- GitHub Docs 外部サイトdocs.github.com