Скачать cwco - Скачать исходный код cwco

cwco

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

Release 1.7.8

Скачать

CWCO

Библиотека веб -компонентов Contextfull, созданная для улучшения пользовательского опыта пользователя нативного веб -компонентов:

✅ Не требуется сборка (подключи и играйте)!
✅ Работает с другими библиотеками и рамками, такими как React, Angular, Vue, Svelte и т. Д.;
✅ Истинно реактивный шаблон
✅ Мощные встроенные директивы (включая способность создавать свои собственные)
✅ Встроенная обработка данных контекста
✅ Связывание событий и данных в HTML и CSS
✅ Строите представление непосредственно в HTML -файле
✅ Простой API
✅ Быстрое рендеринг
✅ Легкий пакет

Документация (cwco.beforeSemolon.com)

Начиная
Webcomponent
ContextProviderComponent
Конфигурации
Шаблон
Стиль
События
Атрибуты
Характеристики
Контекст
Директивы
Пользовательские директивы
LiveCycles
Обработка ошибок

Установить

Этот модуль можно использовать непосредственно в браузере, а также в среде узлов. Вы даже можете использовать его вместе с другими веб -библиотеками и структурами, такими как React и Angular .

Браузер

 <!-- use the latest version -->
< script src =" https://unpkg.com/cwco/dist/cwco.min.js " > </ script >

<!-- use a specific version -->
< script src =" https://unpkg.com/[email protected]/dist/cwco.min.js " > </ script >

<!-- link your app script after -->
< script src =" app.js " > </ script >

Nodejs

 npm install cwco

Затем вы можете импортировать класс конструкторов в соответствии с тем, что вы строите.

 const { WebComponent , ContextProviderComponent , Directive } = require ( 'cwco' ) ;

Кодовые редакторы и Ides

CWCO-это просто HTML, и если вы хотите синтаксис, выделение для VSCODE, вы можете использовать встроенный HTML

VSCODE

Для синтаксиса выделения HTML и CSS в JavaScript используйте плагины Inline-HTML или LIT-HTML.

Вы можете импортировать html из cwco , который является просто помощью для VSCODE, который не делает ничего особенного для строки HTML, с которой вы используете ее.

 import { html , css , WebComponent } from "./cwco" ;

class MyButton extends WebComponent {
  get template ( ) {
    return html `<button><slot></slot></button>`
  }
  
  get stylesheet ( ) {
    return css `<style>button {color: #222}</style>`
    // or 
    // return css`button {color: #222}`
  }
}