NOTE 048 / 2019年
テンプレートと型のあいだで選ぶ
テンプレートと TSX の違いを、チームの事情から考えます。
読了目安 約2分
Vue の画面を TSX で表現すると、型の補完が効きやすく、JavaScript の表現に慣れた人には読みやすいという利点があります。一方で、テンプレートの directive に慣れている人には、別の書き方に見えます。
どちらが優れているかではなく、チームが読み続けられるかを基準に選びます。混在させる場合は、ファイルの役割を決め、同じ画面の中で書き方を揃えると迷いません。
押さえたい点
- 01型の補完と読みやすさで比べる
- 02チームの慣れを基準にする
- 03混在させる範囲を決める
参考資料
外部サイトが開きます。内容は各サイトの管理下にあります。
- Vue.js ガイド 外部サイトvuejs.org
- Vue.js API 外部サイトvuejs.org
- Vue のリアクティブ基礎 外部サイトvuejs.org
- Vue コンポーネント基礎 外部サイトvuejs.org
- Vue Transition 外部サイトvuejs.org
- TypeScript ドキュメント 外部サイトtypescriptlang.org
- TypeScript の設定 外部サイトtypescriptlang.org
- MDN Web Docs 外部サイトdeveloper.mozilla.org
- React リファレンス 外部サイトreact.dev
- web.dev 外部サイトweb.dev
- W3C WAI 外部サイトw3.org
- GitHub Docs 外部サイトdocs.github.com
- Chrome for Developers 外部サイトdeveloper.chrome.com