gumdrops

Gumdrops

Proyek ini berisi komponen reaksi JavaScript yang dapat digunakan kembali yang dapat Anda impor ke dalam proyek Anda.

Prasyarat

Gumdrops harus digunakan dengan sistem desain gumgum (beton), yang menangani semua gaya, serta sass.

Tambahkan desain gumgum dan sass ke proyek Anda.

Lihat dokumentasi sistem desain beton untuk tema, utilitas CSS dan banyak lagi.

Dokumentasi

Lihat dokumentasi untuk perpustakaan ini dan komponennya.

Instalasi

Untuk menambahkan versi tertentu, Anda dapat menggunakan yarn add [email protected] (ganti 1.0.0 dengan versi apa pun yang Anda inginkan, atau hilangkan untuk mendapatkan versi terbaru)

Versi saat ini dan sebelumnya dapat ditemukan di changelog.md

Penggunaan

Perpustakaan mengekspor komponennya sebagai modul ES, sehingga Anda hanya dapat mengimpor apa yang Anda butuhkan, misalnya:

 import Button from 'gumdrops/Button';
import Badge from 'gumdrops/Badge';
import Toggle from 'gumdrops/Toggle';

Ikuti dokumen untuk menggunakan komponen Anda dengan alat peraga yang benar.

Untuk retrocompatibility, bundel CommonJS disediakan. Itu berisi seluruh perpustakaan dan dapat digunakan dengan:

 const gumdrops = require('gumdrops');
// Or
import gumdrops from 'gumdrops';

Untuk kenyamanan dan penggunaan langsung di browser, ada juga UMD yang disediakan di:

 node_modules/gumdrops/gumdrops.umd.js

Menguji Pemecahan Masalah

Sayangnya, ESM belum tersedia secara luas untuk beberapa alat saat ini, dan menjalankan tes menggunakan komponen dari perpustakaan ini dapat melemparkan kesalahan karena sintaks modul ES. Untuk mencegah hal ini, cobalah yang berikut:

• Untuk Jest : Jest menggunakan implementasi kebutuhannya sendiri dan akan mencoba untuk menguraikan file dengannya dan Babel-jest, secara default, itu mengabaikan node_modules yang akan mengakibatkan kesalahan sintaks dari pernyataan impor. Tambahkan baris berikutnya ke konfigurasi Jest Anda sehingga mengabaikan semuanya di Node_Modules, kecuali untuk perpustakaan ini:

   "transformIgnorePatterns": ["/node_modules/(?!gumdrops)"]
  

• Untuk mocha + webpack : Sangat mungkin bahwa konfigurasi mocha dan webpack Anda juga mengabaikan direktori node_modules, untuk mencegah kesalahan sintaks, memuat Babel melalui file konfigurasi alih-alih memanggil --compilers js:babel-register atau --require babel-register secara langsung.

Isi file bisa sesederhana:

 // testSetup.js
require('babel-register')({
    ignore: /node_modules/(?!gumdrops)/
});

// Import it into mocha or mocha-webpack:
--require ./testSetup.js

Prasyarat untuk menjalankan proyek secara lokal

• Aliran git dan git
• NodeJS/NPM & YARN: Versi minimum yang diperlukan - kami telah menguji dengan versi berikut - node: ^16.16.0, npm: ^5.5.1, yarn ^1.2.1
• Instal Eslint Validators dan lebih cantik pada editor pilihan Anda. Kami memiliki file konfigurasi pada root proyek, .eslinrc dan .prettierrc . Ada kait prakomit untuk menjalankan skrip yang lebih cantik pada file.

Menjalankan buku cerita secara lokal

 yarn # install dependencies
yarn run storybook

Kemudian buka http://localhost:6006 di browser Anda. Untuk informasi lebih lanjut, kunjungi React Storybook Repo.

Berkontribusi

Silakan lihat Contributing.md untuk informasi tentang berkontribusi pada proyek ini.

Kontributor

Terima kasih khusus untuk semua kontributor kami! Ditambah yang berikut yang berkontribusi sebelum kami pindah ke GitHub: David Mejorado, Jose Santos, Mike Watt

Lisensi

Apache 2.0

Catatan penting: Proyek ini tidak mendistribusikan kembali perpustakaan pihak ketiga tetapi mengidentifikasi ketersediaannya. Perpustakaan yang dipanggil oleh proyek ini tunduk pada lisensi pencipta mereka. Ingatlah untuk berkonsultasi dan mematuhi semua lisensi dalam penggunaan Anda.