bpit vue

bpit-vue

Introducción

¿Qué es BPIT/Vue?

BPIT/Vue no es un kit de interfaz de usuario de componentes, no teníamos el tema consistente para estos componentes, es solo una colección de componentes de efectos.

BPIT/Vue es un buen lugar para que los principiantes aprendan a crear sus kits de interfaz de usuario. Ahora, es solo una muestra de los efectos que puedo recopilar de Internet (CodePen, GitHub ...) y transferido a Vue things

¿En qué nos enfocamos?

Nos centramos en los efectos de estos componentes que no sean FunctionAilties. Por eso no es un kit de interfaz de usuario.

Tomamos más tiempo en la parte CSS y esperamos que sea más general y fácil de usar, por lo que los encapsulamos en componentes/directivas Vue.

¿Por qué lo necesitamos?

Hay tantos recursos en Internet que podemos usarlos para ahorrar tiempo y ser más eficientes. BPIT/Vue los recoge, los encapsula, los atribuye.

Instalar fácil && import en demanda && todo en un solo lugar

importar a la demanda

NPM Instale Babel-Plugin-Import --Save-Dev

babel.config.js

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

componentes de importación

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

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

muestra

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

Configuración del proyecto

 npm install

Compila y recargadores de calor para el desarrollo

 npm run serve

Compila y minifica para la producción

 npm run build

Ejecute sus pruebas

 npm run test

Pelusas y arregla archivos

 npm run lint