bpit vue

BPIT-VUE

Intro

Apa itu BPIT/VUE?

BPIT/VUE bukan kit UI komponen, kami tidak memiliki tema yang konsisten untuk komponen ini, itu hanya kumpulan komponen efek.

BPIT/VUE adalah tempat yang baik bagi pemula untuk belajar cara membuat kit UI mereka. Sekarang, ini hanya sebuah karya efek yang bisa saya kumpulkan dari internet (codepen, github ...) dan ditransfer ke vue things

Apa yang kami fokuskan?

Kami fokus pada efek dari komponen -komponen ini selain fungsi. Itu sebabnya ini bukan kit UI.

Kami mengambil lebih banyak waktu pada bagian CSS dan berharap untuk membuatnya lebih umum dan mudah digunakan, jadi kami merangkumnya menjadi komponen/arahan VUE.

Mengapa kita membutuhkannya?

Ada begitu banyak sumber daya di internet, kami dapat memanfaatkannya untuk menghemat waktu dan menjadi lebih efisien. BPIT/VUE mengumpulkannya, merangkumnya, mengharuskan mereka.

Instal Easy && Impor On Demand && semuanya di satu tempat

impor sesuai permintaan

NPM menginstal babel-plugin-import-save-dev

Babel.config.js

plugins: [
  [
    "import" ,
    {
      libraryName : "@bpit/vue" ,
      camel2DashComponentName : false ,
      customName : name => {
        return `@bpit/vue/src/components/ ${ name } `
      }
    }
  ]
] 

Komponen Impor

 import { FlockBanner , FAB , FlockButton } from "@bpit/vue"

const FABItem = FAB . FABItem
const FABTrigger = FAB . FABTrigger
const FABContainer = FAB . FABContainer

mencicipi

 < FlockBanner > This is a banner! </ FlockBanner >
< FlockButton > Submit </ FlockButton >
< FABContainer :expand =" expand " >
  < FABItem @click =" test " href =" # " style =" background-color:red " tooltip =" Google+ "
    > A </ FABItem
  >
  < FABItem href =" # " tooltip =" Google+ " > B </ FABItem >
  < FABItem href =" # " tooltip =" Google+ " > C </ FABItem >
  < FABItem href =" # " tooltip =" Google+ " > D </ FABItem >
  < FABTrigger @click =" test " class =" trigger " tooltip =" share " > </ FABTrigger >
</ FABContainer > 

Pengaturan Proyek

 npm install

Mengkompilasi dan memuat hot-reload untuk pengembangan

 npm run serve

Mengkompilasi dan mengurangi untuk produksi

 npm run build

Jalankan tes Anda

 npm run test

Serat dan memperbaiki file

 npm run lint