Yoshino

يوشينو

مكونات واجهة مستخدم مرنة خفيفة الوزن بنية على رد الفعل!

يمكن لأي شخص توليد جميع أنواع الموضوعات بسهولة!

الإنجليزية | ؟؟ 简体中文

المستندات

مستندات

؟ الاستخدام

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

باستخدام CSS عبر الاستيراد:

 import 'yoshino/lib/index.css'

؟ثَبَّتَ

باستخدام NPM:

 npm install yoshino --save

موضوعات

تقدم Yoshino موقع الموضوع ، يمكن للمطورين مشاركة Yoshino-theme مع الآخرين! كيف تشاركك السمات؟ اتبع الخطوات أدناه:

• استخدم قالب سمة Yoshino-Cli إلى GeneArate وافعل ما تريد
• قم بتحميل موضوعات لك إلى github
• مفترق هذا الممثل وتحرير docs/pages/themes/index.tsx لإضافة موضوع msg الخاص بك
• ثم سحب الطلب
• دمج ويمكنك البحث عن موضوعك في موقع الموضوع

تطوير تريد استخدام هذه الموضوعات؟ انقر فوق Yoshino-Cli

؟ كيف تصمم؟

يشبه Yoshino Hexo. إن مكونات yoshino المختلفة من Yoshino تساوي موضوع Hexo مختلف - يوفر مسؤول Hexo فقط مجموعة من الأدوات وموضوع أساسي. يوشينو هو أيضا مثل.

يمكن للمطورين إخراج مكونات النمط الذي يحتاجونه ، تمامًا مثل تكوين موضوع Hexo. يمكنك حتى استخدام CLI لإخراج أنماط مختلفة من المكونات في نفس المشروع.

يجب إكمال موضوعات مختلفة من Yoshino من قبل مجتمع المصدر المفتوح ، وسيوفر المسؤول موقعًا مشابهًا من موقع Yoshino لإظهار موضوعات مختلفة ، على غرار Hexojs/Site

حاليًا ، تدعم أداة Yoshino-Cli فقط مخرجات إنشاء المكونات ، مثل إنشاء مكونات تنبيه مخصصة.

 yoshino new Alert

في وقت لاحق ، يمكن لـ Yoshino-Cli إخراج مكونات المواصفات المقابلة من خلال تعليمات مماثلة لما يلي ، مثل إخراج مكون التنبيه لمواصفات المواد-UI.

 yoshino new Alert --theme material-ui

حتى مكتبة المكون التي تخرج مباشرة السمة بأكملها.

 yoshino new all --theme material-ui

سمات

• تطوير مع TypeScript ، قدم ملفات d.ts لمساعدة المطورين على زيادة سرعة التطوير
• يدافع عن مفهوم OFA(one for all) و AFO(all for one) ، قبل تطوير المشروع من قبل Yoshino-Cli. وفقًا لمشروع واجهة المستخدم ، قم بتوحيد إخراج المكونات.
• بالإضافة إلى مكون ui البسيط والعامة ، يستخلص yoshino بعض مكونات التأثيرات الأكثر قابلية للاستخدام (الميزات) ، مثل
  • المساعدون
  • تموج
  • التحولات
• مكون Icon على أساس Archer-SVGs ، تحميل عند الطلب ، فقط تحميل .svg الذي تستخدمه

؟ المساهمة

؟ عملية التنمية

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

روابط النظام الإيكولوجي

• يوشينو كلاي
• Yoshino-Docs

؟ يوشينو مستوحى أو مدعوم من:

• Archer-SVGS
• تصميم النمل
• موسى
• iview
• الأيوني