Yoshino

Yoshino

Komponen UI PC ringan yang fleksibel dibangun di atas React!

Siapa pun dapat menghasilkan semua jenis tema dengan mudah!

Bahasa Inggris | ?? 简体中文

?

Dokumen

?Penggunaan

 import * as React from 'react';
import { Button } from 'yoshino';

export default function () {
  return (
    <div>
      <Button type="primary">Primary</Button>
      <Button>Default</Button>
      <Button type="dashed">Dashed</Button>
      <Button type="danger">Danger</Button>
    </div>
  )
}

Menggunakan CSS melalui Impor:

 import 'yoshino/lib/index.css'

?Memasang

Menggunakan NPM:

 npm install yoshino --save

? Tema

Yoshino menawarkan situs tema, pengembang dapat berbagi tema Yoshino dengan orang lain! Bagaimana cara membagikan tema Anda? Ikuti langkah -langkah di bawah ini:

• Gunakan yoshino-cli untuk template tema genearate dan lakukan apa yang Anda inginkan
• Unggah tema Anda ke GitHub
• Fork Rep ini dan edit docs/pages/themes/index.tsx untuk menambahkan msg tema Anda
• Kemudian tarik permintaan
• Gabungkan dan Anda dapat mencari tema Anda di tempat tema

Mengembangkan ingin menggunakan tema-tema ini? Klik Yoshino-Cli

? Bagaimana cara merancang?

Yoshino mirip dengan hexo. Komponen gaya Yoshino yang berbeda sama dengan hexo berbagai tema, pejabat hexo hanya menyediakan satu set alat dan tema dasar. Yoshino juga seperti itu.

Pengembang dapat menghasilkan komponen gaya yang mereka butuhkan, seperti mengkonfigurasi tema hexo. Anda bahkan dapat menggunakan CLI untuk mengeluarkan beberapa gaya komponen yang berbeda dalam proyek yang sama.

Tema yang berbeda dari Yoshino perlu diselesaikan oleh komunitas open source, dan pejabat akan memberikan situs yoshino-tema yang serupa untuk menunjukkan tema yang berbeda, mirip dengan hexojs/situs

Saat ini alat Yoshino-Cli hanya mendukung output pembuatan komponen, seperti membuat komponen peringatan khusus.

 yoshino new Alert

Kemudian, Yoshino-Cli dapat menghasilkan komponen spesifikasi yang sesuai melalui instruksi yang mirip dengan yang berikut, seperti mengeluarkan komponen peringatan dari spesifikasi material-UI.

 yoshino new Alert --theme material-ui

Bahkan pustaka komponen yang secara langsung mengeluarkan seluruh tema.

 yoshino new all --theme material-ui

Fitur

• Kembangkan dengan TypeScript , berikan file d.ts untuk membantu pengembang meningkatkan kecepatan pengembangan
• Menganjurkan konsep OFA(one for all) dan AFO(all for one) , sebelum pengembangan proyek oleh Yoshino-Cli. Menurut Project UI, standar output komponen.
• Selain komponen ui yang sederhana dan generik, yoshino menarik beberapa komponen efek (fitur) yang lebih dapat digunakan, seperti
  • Pembantu
  • Riak
  • Transisi
• Komponen Icon Berdasarkan Archer-SVGS, Load On Demand, hanya memuat .svg yang Anda gunakan

? Kontributo

Proses Pengembangan

 npm run dev // 启动开发环境
npm run new ComponentName // 新建组件

Tautan ekosistem

• yoshino-cli
• Yoshino-Docs

? Yoshino terinspirasi atau didukung oleh:

• Archer-SVGS
• Ant-Design
• Muse-ui
• iview
• ionicons