﷽
Assalamu alaykum! Demak Vite texnologiyasi yordamidan Vue loyiha qurishni o’rganamiz!
Vite — Vue.js ilovasini yaratish uchun tez va samarali texnologiya hisoblanadi. Quyida Vite yordamida Vue.js (app) yaratish jarayonini batafsil ko’rib chiqamiz.
1. Muhitni tayyorlash kerak (Preparation of the environment) Birinchidan, kompyuteringizda Node.js o’rnatilganligiga ishonch hosil qiling. Node.js ni rasmiy saytidan yuklab olish mumkin.
2. Yangi Vue.js loyihasini yaratish: a. Terminal yoki komanda qatori (Command Prompt) ni ochamiz b. Loyihani yaratish uchun quyidagi buyruqni bajaring:
va
npm create vite@latest [loyiha_nomi]
Bu buyruq yangi Vite loyihasini my-app nomi bilan yaratadi va Vue.js shablonidan foydalanishni tanlaymiz.
va bu yerda JavaScriptni tanlaymiz (hozircha) keyinroq TypeScript yoki Nuxt uchun bemalol ishlab ketaveramiz o’rganish uchun JavaScriptdan boshlashimiz mumkin bo’ladi.
cd my-app
npm install
npm run dev
yuqoridagi buyruq orqali biz kerakli “package” larni o’rnatib olib loyihamizni ishga tushurishimiz mukin bo’ladi.
npm run dev
Ushbu buyruqdan so’ng, terminalda mahalliy (local) server manzili ko’rsatiladi, odatda bu http://localhost:3000 yoki 5174 bo’ladi. Brauzeringizda ushbu manzilga o’tib, yangi Vue.js ilovamizni ko’rishimiz mumkin.
3. Loyiha Tuzilmasi Loyiha yaratib, ochilganingizdan so’ng, loyiha tuzilmasi (strukturasi) quyidagicha bo’ladi:
my-app/
├── node_modules/
├── public/
│ └── vite.svg
├── src/
│ ├── assets/
│ │ └── vue.svg
│ ├── components/
│ │ └── HelloWorld.vue
│ ├── App.vue
│ ├── main.js
├── .gitignore
├── index.html
├── package.json
├── README.md
└── vite.config.js
Keyingi maqolada Vue.js loyihamizning tuzilmasi va fayllari , folderlarga, fayllarga qanday nom berish kerak , inshaaAlloh bu haqida batafsil gaplashamiz!
BaarakAllohu fiikum!
Ulashish: