व्यू प्रोजेक्ट में व्यू और कंपोनेंट फोल्डर में क्या अंतर है?

Question

मैंने सिर्फ CLIVue.js प्रोजेक्ट को इनिशियलाइज़ करने के लिए कमांड लाइन ( ) का उपयोग किया है । CLIएक बनाया src/componentsऔर src/viewsफ़ोल्डर।

कुछ महीने हो गए हैं जब मैंने एक Vue प्रोजेक्ट के साथ काम किया है और फ़ोल्डर संरचना मेरे लिए नई है।

के साथ उत्पन्न Vue परियोजना में फ़ोल्डर्स viewsऔर componentsफ़ोल्डरों के बीच अंतर क्या है vue-cli?

Comments

मुझे नहीं लगता कि वे इस मायने में अलग हैं कि वे दोनों एकल-फ़ाइल दृश्य घटक हैं। लेकिन आपके पृष्ठ दृश्य (Home.vue, About.vue, Checkout.vue) को आपके घटकों (Button.vue, LoadingSpinner.vue, आदि) से अलग रखा जा सकता है

— Jeff

यह संरचना में अंतर पर कुछ प्रकाश डालता है

— conjexo

@ जेफ आप एक राजनीतिज्ञ हैं, यदि आपको नहीं होना चाहिए। आपने ओपीएस प्रश्न को दोहराया, लेकिन इसे एक उत्तर की तरह बनाने में कामयाब रहे। जबरदस्त हंसी।

— प्रेस्टनडॉक्स 23'18

Answer 1

सबसे पहले, दोनों फ़ोल्डर, src/componentsऔर src/views, Vue घटक होते हैं।

महत्वपूर्ण अंतर यह है कि कुछ Vue घटक रूटिंग के लिए दृश्य के रूप में कार्य करते हैं ।

Vue में आमतौर पर Vue Router के साथ रूटिंग से निपटने के दौरान, घटक में उपयोग किए गए वर्तमान दृश्य को स्विच करने के लिए मार्गों को परिभाषित किया जाता है <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उपयोग कम से कम एक मार्ग द्वारा किया जाएगा।

---

Vue CLI का उद्देश्य Vue पारिस्थितिक तंत्र के लिए मानक टूलिंग बेसलाइन होना है। यह विभिन्न बिल्ड टूल्स को समझदार चूक के साथ सुचारू रूप से काम करने के लिए सुनिश्चित करता है ताकि आप कॉन्फ़िगरेशन के साथ दिन बिताने के बजाय अपने ऐप को लिखने पर ध्यान केंद्रित कर सकें। एक ही समय में, यह अभी भी प्रत्येक उपकरण के विन्यास को बेदखल करने की आवश्यकता के बिना ट्विक करने की सुविधा प्रदान करता है।

Vue CLI का उद्देश्य तेजी से Vue.js विकास है, यह चीजों को सरल रखता है और लचीलापन प्रदान करता है। इसका लक्ष्य एक नई परियोजना स्थापित करने और आरंभ करने के लिए अलग-अलग कौशल स्तर की टीमों को सक्षम करना है।

दिन के अंत में, यह सुविधा और अनुप्रयोग संरचना का मामला है ।

• कुछ लोग इस एंटरप्राइज़ बॉयलरप्लेट की src/routerतरह अपने व्यू फोल्डर रखना पसंद करते हैं ।
• कुछ लोग इसे व्यूज के बजाय पेज कहते हैं ।
• कुछ लोगों के पास एक ही फ़ोल्डर के तहत उनके सभी घटक होते हैं।

---

उस एप्लिकेशन संरचना को चुनें जो आपके द्वारा काम कर रहे प्रोजेक्ट के लिए सबसे उपयुक्त है।

Comments

यह 100% सही है। आप अपने ऐप को किसी भी तरह से स्ट्रक्चर कर सकते हैं जो आपके लिए मायने रखता है। मैं सभी मार्गों के लिए व्यक्तिगत रूप से "src / Pages" का उपयोग करता हूं। उस फ़ोल्डर में, मैं साइट के प्रत्येक "क्षेत्र" के लिए उप-फ़ोल्डर बनाऊंगा। उदाहरण "src / pages / questions" और उस फ़ोल्डर में, मेरे पास एक index.vue होगा जिसमें प्रश्नों की सूची होगी। मेरे पास एक add.vue होगा जो प्रश्नों को जोड़ने के लिए पेज होगा, आदि ये "पेज" आमतौर पर "पेज" बनाने के लिए आवश्यक घटकों को इकट्ठा करते हैं। अपने "src / Components" फोल्डर में मैं नेविगेशन, फॉर्म एलिमेंट्स, कस्टम शेयर्ड कंपोनेंट्स आदि जैसी चीजों के लिए

— सबफोल्डर्स बनाऊंगा

मुझे लगता है कि पॉपअप / मोडल विंडो जैसे घटक src/componentsइस सम्मेलन द्वारा जाते हैं ?

— साइमन थिएल

@ रेकी, क्या मैं आपसे एंथोन गोर की पुस्तक 'फुल-स्टैक वीयू.जेएस 2 और लारवेल 5' के स्रोत के साथ Vue.JS प्रश्न पर एक नज़र डालने के लिए कह सकता हूं: stackoverflow.com/questions/ 59245577 /… ? EDIT पर विशेष रूप से एक नज़र डालें: OP की धारा

— इस्तियाक अहमद

क्या हम कह सकते हैं कि विचारों के अंदर के घटक घटकों का एक संग्रह है? उदाहरण के लिए, मेरी सूची दृश्य में कई घटक हो सकते हैं और ये घटक देखने में एकल घटक के अंदर रखे / लिपटे हुए हैं?

— आयुष

Answer 2

मुझे लगता है कि इसका एक अधिवेशन। पुन: प्रयोज्य कुछ को src / Components फ़ोल्डर में रखा जा सकता है कुछ ऐसा जो राउटर से बंधा हो src / views में रखा जा सकता है

Answer 3

आम तौर पर फिर से प्रयोग करने योग्य विचारों को अंदर रखने का सुझाव दिया जाता है src/components निर्देशिका । हेडर, फुटर, विज्ञापन, ग्रिड या किसी भी कस्टम नियंत्रण जैसे उदाहरण स्टाइल बॉक्स या बटन को पसंद करते हैं। एक या अधिक घटकों को एक दृश्य के अंदर पहुँचा जा सकता है।

एक दृश्य में घटक हो सकते हैं और एक दृश्य वास्तव में नेविगेशन url द्वारा एक्सेस किया जा सकता है। वे आम तौर पर में रखा जाता हैsrc/views ।

याद रखें कि आप url के माध्यम से अवयवों तक पहुँचने के लिए विवश नहीं हैं। आप किसी भी घटक को इसमें जोड़ने router.jsऔर इसे एक्सेस करने के लिए स्वतंत्र हैं। लेकिन अगर आपको ऐसा करने का इरादा है, तो आप इसे src/viewsरखने की बजाय इसे आगे बढ़ा सकते हैं src/components।

अवयव asp.net वेब रूपों के सादृश्य में उपयोगकर्ता-नियंत्रण हैं।

यह बेहतर रखरखाव और पठनीयता के लिए अपने कोड को संरचित करने के बारे में है।

Answer 4

दोनों फ़ोल्डर मूल रूप से समान हैं क्योंकि वे दोनों घटक रखते हैं, लेकिन Vue की सुंदरता यह है कि वे घटक जो पृष्ठों के रूप में कार्य करेंगे (नेविगेशन के लिए पृष्ठ की तरह रूट किए गए) /viewsफ़ोल्डर में रखे गए हैं , जबकि पुन: प्रयोज्य घटकों जैसे प्रपत्र फ़ील्ड /componentsफ़ोल्डर में रखे गए हैं ।