Yoshino: 一個基於React的可定製化的PC元件庫

ShanaMaid發表於2019-02-16
React元件

Github: https://github.com/Yoshino-UI…

Docs: https://yoshino-ui.github.io/#/

Cli-Tool: https://github.com/Yoshino-UI…

安利一個自己寫的元件庫，歡迎大家指正，star來者不拒，pr也多多益善！

更多內容請移步Github, thanks!

設計思路

Yoshino本質上類似於Hexo，不同的主題元件類似於Hexo的各種theme，hexo官方僅提供了一套工具以及一個基礎主題，Yoshino也是如此。

開發者只需要結合yoshino-cli就能像配置Hexo主題一樣輸出不同風格的元件。

而不同主題的Yoshino需要開源社群完成，官方提供類似的yoshino-theme-site來展示不同的主題，類似於hexojs/site

特性

  • 使用TypeScript開發，提供d.ts檔案幫助開發者提高開發速度
  • 不同專案開發前可以通過yoshino-cli根據專案ui規範進行定製化開發產出。

  • 除了簡單通用的ui元件，yoshino抽離出了一些易用性比較高的特效(功能)元件，例如

    • Helpers
    • Ripple
    • Transitions

安裝

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

相關文章