Rumah  >  Artikel  >  hujung hadapan web  >  Penggunaan perancah Vue-cli dan pengesyoran pemalamnya

Penggunaan perancah Vue-cli dan pengesyoran pemalamnya

WBOY
WBOYasal
2023-06-09 16:11:43563semak imbas

Vue-cli ialah alat perancah yang disediakan secara rasmi oleh Vue.js untuk membina projek Vue Dengan menggunakan Vue-cli, anda boleh membina rangka asas projek Vue dengan cepat, membenarkan pembangun menumpukan pada pelaksanaan logik perniagaan. daripada Luangkan banyak masa untuk mengkonfigurasi persekitaran asas projek. Artikel ini akan memperkenalkan penggunaan asas Vue-cli dan pengesyoran pemalam yang biasa digunakan, bertujuan untuk memberikan panduan kepada penggunaan Vue-cli untuk pemula.

1. Penggunaan asas Vue-cli

  1. Memasang Vue-cli

Sebelum menggunakan Vue-cli, anda perlu memastikan Node dipasang persekitaran .js setempat dan alat pengurusan pakej npm. Kemudian gunakan arahan berikut pada baris arahan untuk memasang Vue-cli:

npm install -g @vue/cli

Jika versi lama Vue-cli telah dipasang, anda perlu menggunakan arahan berikut untuk menaik taraf:

npm update -g @vue/cli
  1. Buat projek Vue

Selepas memasang Vue-cli, anda boleh menggunakan Vue-cli untuk mencipta projek. Gunakan arahan berikut pada baris arahan untuk mencipta projek Vue baharu:

vue create my-project

dengan projek saya ialah nama projek anda dan boleh diubah suai mengikut keperluan. Kemudian ikut gesaan untuk memilih pilihan pratetap yang diperlukan, seperti menggunakan babel, menggunakan penghala, dsb. Selepas pemasangan selesai, anda boleh memasuki direktori projek dan mulakan pelayan pembangunan melalui arahan berikut:

cd my-project
npm run serve
  1. Bina projek Vue

Selepas pembangunan selesai , projek itu perlu dibungkus untuk pelepasan kemudahan. Anda boleh menggunakan arahan berikut untuk membina projek:

npm run build

Perintah ini akan menjana direktori dist dalam direktori akar projek, yang merangkumi semua fail sumber statik selepas binaan. Semua fail dalam direktori dist boleh dimuat naik ke pelayan untuk digunakan.

2. Pengesyoran pemalam Vue-cli

Selain menyediakan alatan pembinaan projek asas, Vue-cli juga menyediakan banyak sambungan pemalam. Berikut ialah beberapa pengesyoran pemalam Vue-cli yang biasa digunakan:

  1. vue-router

vue-router ialah pemalam penghalaan yang disediakan secara rasmi oleh Vue.js , yang boleh membina apl halaman tunggal dengan mudah. Apabila membuat projek baharu menggunakan Vue-cli, anda boleh memilih untuk menambah pemalam vue-router.

  1. vuex

vuex ialah pemalam pengurusan negeri yang disediakan secara rasmi oleh Vue.js, yang digunakan untuk mengurus keadaan aplikasi global. Apabila membuat projek baharu menggunakan Vue-cli, anda boleh memilih untuk menambah pemalam vuex.

  1. sass

sass ialah prapemproses CSS yang menyediakan lebih banyak fungsi sambungan CSS. Apabila membuat projek baharu dengan Vue-cli, anda mempunyai pilihan untuk menambah pemalam sass.

  1. axios

axios ialah klien HTTP berasaskan Promise yang boleh digunakan dalam penyemak imbas dan Node.js. Dalam aplikasi Vue.js, anda boleh menggunakan axios untuk menghantar permintaan HTTP. Apabila membuat projek baharu dengan Vue-cli, anda mempunyai pilihan untuk menambah pemalam axios.

  1. babel

babel ialah alat untuk menukar kod ES6+ kepada versi yang serasi ke belakang, yang membolehkan pembangun Membangunkan menggunakan ciri JavaScript terkini. Apabila membuat projek baharu dengan Vue-cli, anda boleh memilih untuk menambah pemalam babel.

  1. eslint

eslint ialah alat analisis kod statik yang digunakan untuk mencari masalah yang mungkin berlaku semasa pengekodan. Apabila membuat projek baharu dengan Vue-cli, anda mempunyai pilihan untuk menambah pemalam eslint. Anda boleh melaraskan konfigurasi seperti peraturan dan gesaan ralat mengikut keperluan anda sendiri.

  1. vuetify

vuetify ialah pustaka komponen Vue.js berdasarkan Reka Bentuk Bahan, menyediakan satu set komponen UI yang luar biasa. Anda boleh menggunakan arahan Vue-cli untuk menambah pemalam vuetify:

vue add vuetify

Di atas ialah beberapa pengesyoran pemalam Vue-cli yang biasa digunakan. Sudah tentu, anda juga boleh memperkenalkan pemalam yang sepadan mengikut keperluan projek anda sendiri.

Ringkasan

Vue-cli ialah alat perancah yang disediakan secara rasmi oleh Vue.js untuk membina projek Vue dengan cepat, yang boleh meningkatkan kecekapan pembangunan dan mengurangkan kesukaran pembangunan projek. Apabila menggunakan Vue-cli untuk membina projek, anda harus biasa dengan arahan asasnya dan pemalam biasa untuk membina aplikasi Vue yang berkualiti tinggi dan sangat boleh diselenggara.

Atas ialah kandungan terperinci Penggunaan perancah Vue-cli dan pengesyoran pemalamnya. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn