Download anywhere webcomponents anywhere webcomponents

anywhere webcomponents

Componentes de terceiros

1.0.0

Baixar

Componentes da Web em qualquer lugar

Demo aqui | Roteiro

Este projeto é um trabalho em andamento. Consulte a página de projetos para rastrear todo o status.

O sistema de design e as especificações ainda estão abertos, mas devem ser inspirados em nebular, Bootstrap e Tailwind.

Dê feedback

Escreva um comentário sobre o sistema de design, dê seu feedback!

Suporte do navegador

Cromo	New Edge (cromo)	Safári	Firefox	Borda mais antiga	Ou seja
60+	79+	10.1+	63+	16-18 (Polyfills)	> = 11 (Polyfills)

Veja documentos completos

Como instalar

Npm

Instale a dependência:

npm i @tiagoboeing/anywhere-webcomponents

E importar anywhere-webcomponents.js :

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

Para uso em estruturas, consulte a página de estêncil.

Via CDN (candidato a liberação)

Agora você pode testar componentes em uma página HTML importando via script da CDN.

Estável

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

Libere o candidato (Desenvolva a filial)

(Atenção !! não use para produção!)

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

Outra alternativa é usar unpkg, para isso, substitua o seguinte URL: https://unpkg.com/@tiagoboeing/anywhere-webcomponents@latest/dist/anywhere-webcomponents/anywhere-webcomponents.js

Aplicações angulares

npm i @tiagoboeing/anywhere-webcomponents

Em seu app.module.ts declare 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 { }

E no final do arquivo main.ts , adicione as seguintes importações:

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

defineCustomElements ( ) ;

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

Reaja aplicações

yarn add @tiagoboeing/anywhere-webcomponents

No seu arquivo src/index.js ou src/index.tsx (projeto da tipscript), adicione as seguintes importantes de preferência antes da renderização do React:

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

defineCustomElements ( ) ;

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