fishd-mobile
    TypeScript icon, indicating that this package has built-in type declarations

    0.1.2 • Public • Published

    ppfish-design-mobile

    快速开始

    # 安装依赖
    npm install
    # 启动开发环境
    npm run dev
    # 编译组件库
    npm run build:mobile
    # 编译文档站点
    npm run build
    

    如何开发一个组件

    1. 全局安装fishd-mobile-tools
    npm i fishd-mobile-tools -g
    
    1. 在组件库项目根目录执行命令
    fm create 组件名称
    
    1. 在/source/components/index 引入创建的组件
    2. 在site/docs/zh-CN 中创建组件说明文档,文档中:::demo部分会被编译成预览demo
    3. 在site/config 配置组件

    文档即DEMO

    • 在开发组件时,我们只需要单独维护【组件.md】即可,fishd-doc插件会自动编译markdown中的demo并通过文档库站点实时预览。
    • 具体使用方法参见fishd-doc

    单元测试

    • jest
    • enzyme
    • antd、ppfish
      • 组件UI测试:snapshot,有一个统一的实现方法demoTest.js,去render打快照(demo.test.js)
      • 交互逻辑测试(index.test.js)
    • vant列了一些交互逻辑测试

    git commit

    husky lint-staged travis-ci commitizen conventional-changelog husky cnpm时会有问题 => https://github.com/typicode/husky/issues/640

    travis

    travis-ci需要github owner激活下travis Build Status

    直接script引入

    引入dist下的fishd-mobile.min.js和fishd-mobile.min.css和cdn的react react-dom

    <script crossorigin src="https://unpkg.com/react@16/umd/react.production.min.js"></script>
    <script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js"></script>
    const Button = window['fishd-mobile'].Button;
     
    function App() {
      return (
        <div className="App">
          <Button type="primary">button</Button>
        </div>
      );
    }

    Keywords

    none

    Install

    npm i fishd-mobile

    DownloadsWeekly Downloads

    9

    Version

    0.1.2

    License

    ISC

    Unpacked Size

    1.23 MB

    Total Files

    683

    Last publish

    Collaborators

    • hangaoke