vmc

VMC

Componentes móviles para [email protected]+.

Si necesita usar VMC en Vue1.x, consulte la rama @1x.

Ver demostraciones

Introducción de características

VMC es una biblioteca de componentes desarrollada para terminales móviles, adecuada para [email protected]+ .

• Globalizar componentes con alta frecuencia de uso y registrarlos directamente en objetos de instanciación VUE;
• Todos los estilos se basan en menos y permiten una inicialización rápida de los estilos de componentes sobrescribiendo menos variables;
• Al mismo tiempo, también puede optar por usar SASS, y también proporcionamos una hoja de estilo basada en SCSS;
• El estilo de cada componente se puede definir individualmente a través de atributos (escriba al estilo para que el estilo global definido en menos se pueda sobrescribir).

Cómo citar

Modo de spa basado en Webpack

Instalación y referencia

$ npm install vmc --save

Registre los componentes globales

Agregue lo siguiente al archivo de entrada:

 import VMC from 'vmc/install' ;

Vue . use ( VMC ) ; 

Introducción de estilos de componentes

Con menos superposición variable, algunos estilos iniciales de componentes se pueden personalizar, por lo que se deben introducir menos archivos manualmente.

 @import "vmc/src/styles/vmc.less" ;
@import "assets/less/vmc.custom.less" ;      // 自定义变量覆盖，参考styles/base/variable.less

O use la anulación de variable SASS para personalizar algunos estilos iniciales de componentes, y también necesita introducir manualmente archivos SCSS.

 @import "assets/scss/vmc.custom.scss" ;      // 自定义变量覆盖，参考scss/base/variable.scss
@import "vmc/src/scss/vmc.scss" ;

Componentes de referencia

 import { Navbar } from 'vmc' ;

Referencia de etiqueta regular

Instalación y referencia

Descargue directamente vmc.css y vmc.js en dist .

 < link rel =" stylesheet " href =" vmc.css " >

< div id =" app " >
    < v-button type =" success " @click =" $Alert('Hello world!') " >按钮</ v-button >
</ div >

< script src =" vue.js " > </ script >
< script src =" vmc.js " > </ script >

< script >
    new Vue ( {
        el : '#app'
    } ) ;
</ script > 

Registre los componentes globales

Este método registra automáticamente los componentes globales y registra automáticamente todos los componentes sin operaciones adicionales.

Lista de componentes

Componentes CSS

• icono icono (icono)

• Bordamiento de 1px (borde de 1 px)

• Logotipo (insignia)

• Alineación de ambos extremos (justificar)

• Omisión de texto (Nowrap)

• Punto rojo

Componentes JS

• Hoja de acción

• Box de advertencia (alerta)

• Caja de marcador de posición (caja)

• Botón

• Tarjeta

• Columna única (celda)

• Caja

• Confirmar

• Caja de diálogo

• Actualización de la paginación (carga de caída)

• Red

• Cuadro de entrada forzado (Minput)

• Caja de entrada rápida (Vinput)

• Alineación de ambos extremos (justificar)

• Anuncio rodante (marquesina)

• Barra de navegación

• Entrada digital (número)

• Cubrir

• Recogedor

• Capa emergente (ventana emergente)

• Recogedor emergente

• Seleccionador de fecha emergente

• Barra de progreso

• Cuzón de entrada de pedido (indicador)

• Caja de radio

• Calificación (evaluador)

• Fila de título

• Imagen de carrusel (control deslizante)

• Indicador dinámico (spinner)

• Botón de envío (enviar)

• Barra de navegación (Tabbar)

• TabControl

• Textea

• Interruptor (alternar)

• Aviso de carga

• Información de éxito (éxito)

• Solicitud de error (error)

• INFORMACIÓN ANTERIOR (Información)

• Aviso de texto (tostadas)

• Subir componente (carga)

Desarrollo y compilación

Desarrollo

 $ npm run dev

Después de ejecutar el comando, los archivos en el directorio examples se ejecutarán automáticamente para el desarrollo y la depuración.

liberar

 $ npm run release

Después de ejecutar el comando, vmc se publicará en dist .

Compilación

 $ npm run build

Después de ejecutar el comando, los archivos en el directorio examples se empaquetarán automáticamente en docs .

Avance

 $ npm run docs

Después de ejecutar el comando, el directorio docs se utilizará como un recurso de servidor de documentos estáticos y se puede acceder directamente desde el navegador.

Licencia

MIT