Yoshino

Yoshino

Flexible leichte PC -UI -Komponenten, die auf React aufgebaut sind!

Jeder kann leicht alle möglichen Themen erzeugen!

Englisch | ?? 简体中文

? Docs

Dokumente

?Verwendung

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

Verwenden von CSS über Import:

 import 'yoshino/lib/index.css'

?Installieren

Verwenden von NPM:

 npm install yoshino --save

Themen

Yoshino bietet eine Themensituation an, Entwickler können Yoshino-Themen mit anderen teilen! Wie teile ich Ihnen Themen? Befolgen Sie die folgenden Schritte:

• Verwenden Sie Yoshino-Cli, um die Themenvorlage zu genearat und tun, was Sie wollen
• Laden Sie Ihre Themen in GitHub hoch
• Geben Sie diesen Repräsentanten und bearbeiten Sie docs/pages/themes/index.tsx um Ihr Thema MSG hinzuzufügen
• Dann an Anfrage ziehen
• Zusammenführen und Sie können Ihr Thema auf Themensituation durchsuchen

Entwickelt möchten diese Themen verwenden? Klicken Sie auf Yoshino-Cli

? Wie gestaltet ich?

Yoshino ähnelt dem Hexo. Die verschiedenen Stilkomponenten von Yoshino entsprechen dem hexo verschiedenen Themen. Hexo -Beamter bietet nur eine Reihe von Tools und ein grundlegendes Thema. Yoshino ist auch so.

Entwickler können die Komponenten des Stils ausgeben, das sie benötigen, genau wie das Konfigurieren des Hexo -Themas. Sie können sogar CLI verwenden, um mehrere verschiedene Komponentenstile im selben Projekt auszugeben.

Verschiedene Themen von Yoshino müssen von der Open-Source-Community abgeschlossen werden, und der Beamte wird eine ähnliche Yoshino-Theme-Site bieten, um unterschiedliche Themen zu zeigen, ähnlich wie bei Hexojs/Site

Derzeit unterstützt das Yoshino-Cli-Tool nur die Ausgaben der Komponentenerstellung, z. B. das Erstellen von benutzerdefinierten Warnkomponenten.

 yoshino new Alert

Später kann Yoshino-Cli entsprechende Spezifikationskomponenten durch Anweisungen ausgeben, die den folgenden ähneln, z. B. die Ausgabe der Alarmkomponente der Material-UI-Spezifikation.

 yoshino new Alert --theme material-ui

Sogar eine Komponentenbibliothek, die das gesamte Thema direkt ausgibt.

 yoshino new all --theme material-ui

Merkmale

• Entwickeln Sie mit TypeScript , stellen Sie d.ts -Dateien zur Verfügung, um Entwicklern dabei zu helfen, die Entwicklungsgeschwindigkeit zu erhöhen
• Befürworten Sie das Konzept von OFA(one for all) und AFO(all for one) vor der Projektentwicklung durch Yoshino-Cli. Laut Project UI standardisieren Sie die Ausgabe von Komponenten.
• Neben der einfachen und generischen ui -Komponente zeichnet yoshino einige der nutzbareren Effekte (Merkmale) Komponenten heraus, wie z.
  • Helfer
  • Ripple
  • Übergänge
• Icon Komponente basierend auf Archer-SVGs, Last auf Bedarf, nur Last .svg , die Sie verwenden

? Mitwirkende

? Entwicklungsprozess

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

? Ökosystemlinks

• Yoshino-Cli
• Yoshino-Docs

Yoshino ist inspiriert oder angetrieben von:

• Archer-Svgs
• Ameisenneigung
• muse-ui
• IView
• Ionicons