Unduh cwco - Unduh Kode Sumber cwco

cwco

Komponen pihak ketiga

Release 1.7.8

Unduh

CWCO

Perpustakaan Komponen Web ContextFull Dibuat untuk Meningkatkan Pengalaman Pengguna API Komponen Web asli dengan:

✅ Tidak diperlukan build (plug and play)!
✅ Bekerja dengan perpustakaan dan kerangka kerja lain seperti React, Angular, Vue, Svelte, dll;
✅ Template yang benar -benar reaktif
✅ Arahan bawaan yang kuat (termasuk kemampuan untuk membuat sendiri)
✅ Penanganan data konteks bawaan
✅ Peristiwa dan Ikatan Data di HTML dan CSS
✅ Bangun tampilan langsung di file html
✅ API Sederhana
✅ rendering cepat
✅ Paket ringan

Dokumentasi (cwco.beforesemicolon.com)

Memulai
WebComponent
ContextProviderComponent
Konfigurasi
Templat
Gaya
Acara
Atribut
Properti
Konteks
Arahan
Arahan khusus
LiveCycles
Penanganan kesalahan

Memasang

Modul ini dapat digunakan langsung di browser juga di lingkungan simpul. Anda bahkan dapat menggunakannya bersama dengan perpustakaan dan kerangka kerja web lainnya seperti React and Angular .

Browser

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

Anda kemudian dapat mengimpor kelas konstruktor sesuai dengan apa yang Anda bangun.

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

Editor & IDE Kode

CWCO hanyalah HTML dan jika Anda ingin menyorot sintaks untuk vScode, Anda dapat menggunakan inline-html

Vscode

Untuk sintaksis sintaks HTML dan CSS dalam JavaScript menggunakan plugin inline-HTML atau lit-HTML.

Anda dapat mengimpor html dari cwco yang hanya merupakan bantuan untuk vScode yang tidak ada yang istimewa untuk string HTML yang Anda gunakan.

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