Vue.jsのComponentのディレクトリ構造 | 全国個人事業主支援協会

COLUMN コラム

Vue.jsのComponentのディレクトリ構造

Vueなどのコンポーネント指向のフレームワークを扱う時は

・componens

・pages

で管理しています。ページのベースになる親コンポーネントをpages、それ以外をcomponentsへ。

階層はこれ以上深くせずに全て直下に配置しています。

ディレクトリ構造が非常にシンプルになるので、ファイルの配置場所を考えることがありません。

このディレクトリ構造にすると、結果的に同じディレクトリにファイルが多数配置されることになるため、抵抗を感じる方もいると思いますが、

vscodeなどのエディタはファイル名を検索して開くことが可能なので、今はさほど困らないですし、

何より保存時にファイルの命名をしっかり考えざるを得なくなるという自浄作用も働くので、結果的に良いと思っています。

Webエンジニアしてます。2020年に独立しました。技術的なことから個人事業主として必要なことまで色々お話しします。