[解決済み] Vueプロジェクトにおけるviewsフォルダとcomponentsフォルダの違いは何ですか?
質問
先ほど、コマンドライン(
CLI
) を使って、Vue.js プロジェクトを初期化しました。このとき
CLI
を作成しました。
src/components
と
src/views
フォルダーに格納されます。
Vueのプロジェクトに携わるのは数ヶ月ぶりなので、フォルダ構造が新鮮に感じられます。
とはどのような違いがあるのでしょうか?
views
と
components
で生成されたVueプロジェクト内の
vue-cli
?
解決方法は?
まず、両フォルダ。
src/components
と
src/views
には、Vueのコンポーネントが含まれています。
重要な違いは、一部のVueコンポーネントが ビュー をルーティングのために使用します。
Vueでルーティングを扱う場合、通常は
Vue ルーター
を切り替えるために、ルートが定義されています。
ビュー
で使用される
<router-view>
コンポーネントを使用します。これらのルートは通常
src/router/routes.js
というようなことが書かれています。
import Home from '@/views/Home.vue'
import About from '@/views/About.vue'
export default [
{
path: '/',
name: 'home',
component: Home,
},
{
path: '/about',
name: 'about',
component: About,
},
]
の下にあるコンポーネントは
src/components
の下にあるコンポーネントはルートで使われる可能性が低いのに対して
src/views
は、少なくとも1つのルートで使用されます。
Vue CLIは、Vueの標準的なツールのベースラインとなることを目指しています。 エコシステムです。様々なビルドツールがスムーズに連動するよう そのため、ユーザーはアプリの作成に集中することができます。 設定に何日も悩まされることになります。同時に 各ツールの設定を柔軟に変更することができます。 イジェクトする必要があります。
Vue CLIは、Vue.jsの迅速な開発を目指し、物事をシンプルに保ち、柔軟性を提供します。その目標は、さまざまなスキルレベルのチームが新しいプロジェクトをセットアップして始められるようにすることです。
一日の終わりに 利便性とアプリケーションの構造の問題である .
-
人によっては、Views フォルダを
src/router
のように これ エンタープライズ・ボイラープレートです。 - と呼ぶ人もいます。 ページ ではなく ビュー .
- 人によっては、すべてのコンポーネントを同じフォルダの下に置いている人もいます。
作業中のプロジェクトに最適なアプリケーション構造を選択します。
関連
-
[解決済み] v-if内部の複雑な条件
-
[解決済み] Vue 2.0でコンポーネント自身を削除する方法
-
Vueプロジェクトのビルド共通設定ファイル、request.jsとvue.config.js
-
vue3 が axios エラーを導入する 未定義または null をオブジェクトに変換できない
-
[解決済み] インポートパスの中の@はどういう意味ですか?
-
[解決済み】Vue.jsの別ページへのリダイレクトについて
-
[解決済み] vuejs ルータのオプションのパラメータ
-
[解決済み] Vue.jsで環境変数を使用する
-
[解決済み] Vueの「エクスポートデフォルト」と「新しいVue」の比較
-
[解決済み] Vueアプリのビルドを生成するには、どのコマンドを使用すればよいですか?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] Vue.jsで12件中1~3件を表示させるには?
-
[解決済み] オブジェクトのリストからオブジェクトを選択するBootstrap vue b-form-select
-
Vue.js学习的第一天
-
Vueプロジェクトのビルド共通設定ファイル、request.jsとvue.config.js
-
プロキシエラーです。localhost:8090 から http:10.12.0.15:7777 へのリクエスト /queryCarList をプロキシできませんでした。
-
vue springboot reports error DOMException: XMLHttpRequest'の'send'の実行に失敗しました。ロードに失敗しました
-
[解決済み】TypeError: this.getOptions は関数ではありません。
-
[解決済み】@clickとv-on:clickの違い Vuejs
-
[解決済み] vuejs ルータのオプションのパラメータ
-
[解決済み] Vueアプリのビルドを生成するには、どのコマンドを使用すればよいですか?