Vueのディレクトリ構成
Thu Jul 04, 2019 · 82 words

今の自分の中で Vue のディレクトリ構成の最適解

そもそも色々と疑問があった。

なぜ component は毎回個別に import するのか?

なぜ JS は一個の object でどうにかしようとしているのにすべては詰め込まないのか

でっかい object だとまぁーメモリやら通信速度やら問題は、あるのはわかっているがそもそも論が始まりそうだし宗教問題に発展してそうな雰囲気

答えは OSS で生まれるのかも

人気のある FW やライブラリに関しては、いろんな人がいろんな提案し今の最適解を出そうとしているし他人にコードを読んもらうことを意識した書き方をしているためかリーダブルであることが多くとても有意義

エンジニアリングは、エンジニアのスキルをあげることにも一役買っていると思う。

答え出なくても draft にはなる

最適解が生まれづらい JS という世界では、現時点でベストであるというだけでも十分かなと思う。

## で最初の表題へ戻る

├── components
├── container
├── lib
├── router
└── store

途中段階だけど上記のような流れになるかなと

いちいち components を import するのはだるいので中規模もしくは、ページ数が少ない、ないし小規模ならばグローバルに登録してしまえって思う。特に管理画面系を作成するならなおのこと思う

都度 import をする記述が減るって happy だと思う

また sotre の中も色々考えるけど

mutations, getters, actions等々分けてもいいわけだし

なんなら機能単位もしくは、ドメイン単位でサブディレクトリをmodulesみたいな作ってstoreに modules で登録すればいいねって思った

さすれエンドポイントの file の記述が少なからず減るし 全体的な可読性が高まると思う。

ヒントというか元になったのは

vuetify の管理画面関連の OSS の構成

最初に見た際に衝撃は受けた。Qiita とかでもディレクトリ構成に関しては、あまり言及がない気がする

ひとまず今回は、以上

最近は、画面関連の実装が増えているが Laravel の DDD もどき Repository pattern の話をしたいと思う


back · Top · About · Resume · Posts ·