Ppfish Components Save

Fish Design: 面向B端设计的企业级UI组件库

Project README

Fish Design

Travis branch CI Status NPM downloads FOSSA Status

Introduction

Fish Design is an enterprise-class UI component library which based on React, helps designers and developers quickly build systems.

Features

  • Babel with ES6
  • Hot reloading
  • Testing
  • Linting
  • Working example app
  • Server side rendering

Browsers Support

  • Modern browsers and Internet Explorer 11+
IE / EdgeIE / Edge FirefoxFirefox ChromeChrome SafariSafari OperaOpera ElectronElectron
IE11, Edge last 2 versions last 2 versions last 2 versions last 2 versions last 2 versions

Initial Machine Setup

  • Install Node.js

  • (Optional)Install taobao NPM image

    $ npm install -g cnpm --registry=https://registry.npm.taobao.org
    

Install

npm install ppfish --save

Usage

Browser

import React from 'react';
import ReactDOM from 'react-dom';
import { Button } from 'ppfish';

ReactDOM.render(<Button type="primary">Primary</Button>, document.getElementById('app'));

Development

Install npm(or cnpm) package

$ npm install

Start development in your default browser

$ npm run dev

Open your browser and visit http://127.0.0.1:5000

Build

Build scripts and css etc.

$ npm run build

Build site

$ npm run docs:build

The directory structure

.
├── /coverage/                        # 运行npm run test:cover输出的测试覆盖率文件
├── /dist/                            # 构建输出的文件,使用全局变量方式引用,可用于发布到CDN
├── /docs                             # 项目文档
├── /lib/                             # 构建输出的文件
├── /node_modules/                    #
├── /site/                            # 组件库官网
| ├── /assets                         #
| ├── /componentsPage                 # 组件库官网页面
| ├── /docs                           # 组件库官网文档
| ├── /locales                        # 组件库官网本地化文案
| ├── /pages                          #
| ├── /static                         # 组件库官网Demo使用的icon
| ├── /styles                         #
| ├── /index.html                     #
| └── /index.js                       #
├── /source/                          # 组件源码
│ ├── /assets/                        #
│ ├── /components/                    # React components
│ ├── /hooks/                         #
│ ├── /typings /                      #
│ └── /utils/                         #
├── /tools/                           # 项目脚本
├── .babelrc                          #
├── .editorconfig                     #
├── .eslintignore                     #
├── .eslintrc.js                      #
├── .gitignore                        #
├── .npmignore                        #
├── .stylelintignore                  #
├── .stylelintrc.js                   #
├── .travis.yml                       #
├── jets.config.js                    #
├── package.json                      #
├── postcss.config.js                 #
├── README.md                         #
├── tsconfig.json                     #
├── webpack.config.dev.site.js        # 文档网站本地开发编译配置
└── webpack.config.prod.site.js       # 文档网站生产环境编译配置
Open Source Agenda is not affiliated with "Ppfish Components" Project. README Source: NSFI/ppfish-components
Stars
273
Open Issues
0
Last Commit
6 months ago
License
MIT

Open Source Agenda Badge

Open Source Agenda Rating