VueJS - Pengaturan Lingkungan
Ada banyak cara untuk menginstal VueJS. Beberapa cara tentang bagaimana melakukan instalasi dibahas di depan.
Menggunakan tag <script> langsung di file HTML
<html>
<head>
<script type = "text/javascript" src = "vue.min.js"></script>
</head>
<body></body>
</html>
Buka situs beranda https://vuejs.org/v2/guide/installation.htmldari VueJS dan unduh vue.js sesuai kebutuhan. Ada dua versi untuk digunakan - versi produksi dan versi pengembangan. Versi pengembangan tidak diminimalkan, sedangkan versi produksi diminimalkan seperti yang ditunjukkan pada tangkapan layar berikut. Versi pengembangan akan membantu dengan peringatan dan mode debug selama pengembangan proyek.
Menggunakan CDN
Kami juga dapat mulai menggunakan file VueJS dari perpustakaan CDN. Tautanhttps://unpkg.com/vueakan memberikan versi terbaru VueJS. VueJS juga tersedia di jsDelivr (https://cdn.jsdelivr.net/npm/vue/dist/vue.js) dan cdnjs (https://cdnjs.cloudflare.com/ajax/libs/vue/2.4.0/vue.js).
Kami dapat meng-host file di bagian akhir kami, jika diperlukan dan memulai pengembangan VueJS.
Menggunakan NPM
Untuk aplikasi berskala besar dengan VueJS, disarankan untuk menginstal menggunakan paket npm. Itu datang dengan Browserify dan Webpack bersama dengan alat lain yang diperlukan, yang membantu pengembangan. Berikut adalah perintah untuk menginstal menggunakan npm.
npm install vue
Menggunakan CLI Command Line
VueJS juga menyediakan CLI untuk menginstal vue dan memulai aktivasi server. Untuk menginstal menggunakan CLI, kita perlu menginstal CLI yang dilakukan menggunakan perintah berikut.
npm install --global vue-cli
Setelah selesai, ini menunjukkan versi CLI untuk VueJS. Diperlukan beberapa menit untuk penginstalan.
+ [email protected]
added 965 packages in 355.414s
Berikut adalah perintah untuk membuat proyek menggunakan Webpack.
vue init webpack myproject
Untuk memulai, gunakan perintah berikut.
cd myproject
npm install
npm run dev
Setelah kami menjalankan npm run dev, itu memulai server dan menyediakan url untuk tampilan yang akan dilihat di browser seperti yang ditunjukkan pada tangkapan layar berikut.
Struktur proyek yang menggunakan CLI terlihat seperti berikut.