bpit vue

bpit-vue

Intro

Was ist BPIT/VUE?

BPIT/VUE ist kein Komponenten -UI -Kit, wir hatten nicht das konsistente Thema für diese Komponenten, sondern nur eine Sammlung von Effektkomponenten.

BPIT/VUE ist ein guter Ort für Anfänger, um zu lernen, wie man ihre UI -Kits kreiert. Jetzt ist es nur ein Schaufenster der Effekte, die ich aus dem Internet sammeln kann (Codepen, Github ...) und übertragen zu Vue things

Was konzentrieren wir uns?

Wir konzentrieren uns auf die Auswirkungen dieser anderen Komponenten als FunktionSailties. Deshalb ist es kein UI -Kit.

Wir nehmen uns mehr Zeit für CSS -Teil und hoffen, es allgemeiner und einfacher zu verwenden. Daher sind sie in VUE -Komponenten/-anweisungen zusammengefasst.

Warum brauchen wir es?

Es gibt so viele Ressourcen im Internet, dass wir sie nutzen können, um Zeit zu sparen und effizienter zu sein. BPIT/VUE sammelt sie, verkaps sie und sorgt sie.

Installieren Sie Easy && importieren Sie bei Bedarf und alles an einem Ort

Einfuhr bei Bedarf

NPM installieren Babel-Plugin-Import-Save-dev

babel.config.js

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

Komponenten importieren

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

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

Probe

 < 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 > 

Projekt -Setup

 npm install

Kompiliert und heiß-reloads für die Entwicklung

 npm run serve

Kompiliert und minimiert für die Produktion

 npm run build

Führen Sie Ihre Tests aus

 npm run test

FINTS und behebt Dateien

 npm run lint