Descargar el anywhere webcomponents del código fuente anywhere webcomponents .

anywhere webcomponents

Componentes de terceros

1.0.0

Descargar

Componentes web en cualquier lugar

Demostración aquí | Hoja de ruta

Este proyecto es un trabajo en progreso. Consulte la página de proyectos para rastrear todo el estado.

El sistema de diseño y las especificaciones aún están abiertos, pero deben inspirarse en nebular, bootstrap y viento de cola.

Dar retroalimentación

¡Escribe un comentario sobre el sistema de diseño, da tus comentarios!

Soporte del navegador

Cromo	Nuevo borde (cromo)	Safari	Firefox	Borde más antiguo	ES DECIR
Más de 60	79+	10.1+	63+	16-18 (Polyfills)	> = 11 (Polyfills)

Ver documentos completos

Cómo instalar

Npm

Instalar dependencia:

npm i @tiagoboeing/anywhere-webcomponents

E importar anywhere-webcomponents.js :

 < script src = "@tiagoboeing/anywhere-webcomponents/dist/anywhere-webcomponents/anywhere-webcomponents.js" > </ script >

Para su uso en los marcos, consulte la página de la plantilla.

A través de CDN (candidato de lanzamiento)

Ahora puede probar los componentes en una página HTML importando a través del script desde CDN.

Estable

 < script src =" https://cdn.tiagoboeing.com/anywhere-webcomponents/master/anywhere-webcomponents/anywhere-webcomponents.js " > </ script >
< aw-button label =" Primary " mode =" square " color =" outline " status =" success " > </ aw-button >

Candidato de liberación (Desarrollar rama)

(¡Atención! ¡No se usa para la producción!)

 < script src =" https://cdn.tiagoboeing.com/anywhere-webcomponents/develop/anywhere-webcomponents/anywhere-webcomponents.js " > </ script >
< aw-button label =" Primary " mode =" square " color =" outline " status =" success " > </ aw-button >

Otra alternativa es utilizar UNPKG, para esto, sobrescribir con la siguiente URL: https://unpkg.com/@tiagoboeing/anywhere-webcomponents@latest/dist/anywhere-webcomponents/anywhere-webcomponents.js

Aplicaciones angulares

npm i @tiagoboeing/anywhere-webcomponents

En su app.module.ts declara CUSTOM_ELEMENTS_SCHEMA :

 import { NgModule , CUSTOM_ELEMENTS_SCHEMA } from '@angular/core' ;

@ NgModule ( {
  declarations : [
    AppComponent
  ] ,
  imports : [
    BrowserModule ,
    AppRoutingModule
  ] ,
  providers : [ ] ,
  bootstrap : [ AppComponent ] ,
  schemas : [ CUSTOM_ELEMENTS_SCHEMA ]   // <-- declare this
} )
export class AppModule { }

Y en el final del archivo main.ts , agregue las siguientes importaciones:

 import { applyPolyfills , defineCustomElements } from '@tiagoboeing/anywhere-webcomponents/loader' ;

defineCustomElements ( ) ;

// for IE support (optional)
applyPolyfills ( ) . then ( ( ) => {
  defineCustomElements ( )
} )

Reaccionar aplicaciones

yarn add @tiagoboeing/anywhere-webcomponents

En su archivo src/index.js o src/index.tsx (proyecto de mecanografiado), agregue las siguientes importaciones preferiblemente antes del render react:

 import { applyPolyfills , defineCustomElements } from '@tiagoboeing/anywhere-webcomponents/loader' ;

defineCustomElements ( ) ;

// for IE support (optional)
applyPolyfills ( ) . then ( ( ) => {
  defineCustomElements ( )
} )