Скачать anywhere webcomponents anywhere webcomponents загрузка исходного кода

anywhere webcomponents

Сторонние компоненты

1.0.0

Скачать

Где угодно веб -компоненты

Демо здесь | Дорожная карта

Этот проект находится в стадии разработки. Смотрите страницу проектов, чтобы отслеживать весь статус.

Система дизайна и спецификации все еще открыты, но должны быть вдохновлены туманным, начальным и тейным ветром.

Дайте обратную связь

Напишите комментарий о системе дизайна, дайте свой отзыв!

Поддержка браузера

Хром	Новый край (хром)	Сафари	Firefox	Старший край	Т.е.
60+	79+	10.1+	63+	16-18 (Полифиллы)	> = 11 (Полифил)

Смотрите полные документы

Как установить

Npm

Установить зависимость:

npm i @tiagoboeing/anywhere-webcomponents

И импортировать anywhere-webcomponents.js :

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

Для использования в фреймворках см. Страницу трафарета.

Через CDN (выпуск кандидата)

Теперь вы можете протестировать компоненты в HTML -странице, импортирующей сценарий из CDN.

Стабильный

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

Выпустить кандидата (разработка филиала)

(Внимание !! не используйте для производства!)

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

Другой альтернативой является использование UNPKG, для этого перезаписывайте следующим URL: https://unpkg.com/@tiagoboeing/anywhere-webcomponents@latest/dist/anywhere-webcomponents/anywhere-webcomponents.js

Угловые приложения

npm i @tiagoboeing/anywhere-webcomponents

В вашем app.module.ts Dercare 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 { }

И в main.ts End of File, добавьте следующее импорт:

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

defineCustomElements ( ) ;

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

Реагировать приложения

yarn add @tiagoboeing/anywhere-webcomponents

В вашем файле src/index.js или src/index.tsx (проект TypeScript) добавьте следующее импорт, предпочтительно перед рендерингом React:

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

defineCustomElements ( ) ;

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