Cara Menginstall Bootstrap pada Vue Js



Bootstrap adalah Framework Css yang sudah populer dan terkenal di kalangan programmer web. Nah pada artikel kali ini saya ingin sharing cara menginstall bootstrap pada vuejs. Kita akan coba install bootstrap secara murni melalui npm.

Sebelumnya sudah ada UI Library seperti BootstrapVue dan Vuestrap yang sudah kompetibel dan support komponen pada vuejs. Bedanya BootstrapVue ini menggunakanya harus menggunakan komponen dari library tersebut contoh <b-input> dan <b-button>. Sedangkan saya biasanya langsung menggunakan <input> dan <button>. Keuntungan nya agar kita bisa menggunakan example bootstrap yang sudah dishare di forum, Guna untuk mengejar permintaan design yang sulit atau mendesain dengan efektif karena menggunakan nya hanya menambahkan class. Berikut dibawah ini cara menginstall bootstrap:

- Buka cmd/terminal

- Masuk ke folder project melalui terminal. dengan perintah cd folder-projek

- Install bootstrap dengan ketik perintah di terminal seperti di bawah ini
npm install bootstrap jquery popper.js

- Jika sudah terinstall silahkan buka code editor(notepad) kalian. dan edit /src/main.js

import 'bootstrap'
import 'bootstrap/dist/css/bootstrap.min.css'

Simpan dan jalankan project vuejs kalian dengan npm run dev.  Sebelumnya saya ingin memberi tau kekurangan menggunakan bootstrap ini, iyalah masih tergantung dengan jquery, padahal vuejs sudah ada Ecmascript.

Oke itu saja yang bisa saya sampaikan, Happy Coding..


Kategori :
Facebook twitter Google

Related Post

Berlangganan update artikel terbaru via email:

0 Komentar