@ywfe/yw-design

在线示例

• 快速上手
• 组件目录
• 版本变更

# 线上版本 https://unpkg.ywwl.com/@ywfe/yw-design@latest/build/index.html
$ npm i @ywfe/yw-design@latest

# 待上线版本 https://unpkg.ywwl.com/@ywfe/yw-design@next/build/index.html
$ npm i @ywfe/yw-design@next

# 测试版本 https://unpkg.ywwl.com/@ywfe/yw-design@test/build/index.html
$ npm i @ywfe/yw-design@test

// 测试或线上 html 模板umd文件版本需与本地npm版本一致，如有问题联系@折柔
// js umd
<script src={`https://cdn.ywwl.com/bps/ywDesign/${pkg.version}/index.umd.js`}></script>
// css umd
<link rel="stylesheet" href={`https://cdn.ywwl.com/bps/ywDesign/${pkg.version}/index.umd.css`}>

import React from 'react';
import ReactDOM from 'react-dom';
import { YwTitle } from '@ywfe/yw-design';
import type { YwTitleProps } from '@ywfe/yw-design';

function App() {
  return <YwTitle text="标题" />;
}
ReactDOM.render(<App />, mountNode);

├── src/                  # 组件源码
│  └── index.tsx
│  └── index.css          # 样式 入口
│  └── types.ts           # types 入口
│  └── components/        # 组件库
│     └── YwTitle/        # 标题组件
│     └── YwContainer/    # 容器组件
│     └── YwTab/          # Tab组件
│     └── YwFilter/       # 筛选器
│     └── YwJsonForm/     # 基础表单
│     └── YwTable/        # 基础表格
│     └── YwTableDialog/  # 弹窗选择器
│     └── YwFormDialog/   # 弹窗表单提交
│     └── YwNotice/       # 页面消息提示
├── demo                  # 组件 demo
│  └── usage.md
├── lib/                  # 构建产物，编译为 ES5 + Commonjs 规范的代码
├── es/                   # 构建产物，编译为 ES5 + ES Module 规范的代码
├── dist/                 # 构建产物，UMD 相关产物，默认不生成，需要通过设置 library 参数开启
├── build/                # 构建产物，用于组件文档预览
├── build.json            # 工程配置
├── README.md
├── CHANGELOG.md
└── package.json

功能明细见 CHANGELOG.md

# 本地环境 第一次安装需要把node版本切到14
$ npm install

# 本地启动
$ npm start

# 本地构建 修改组件版本：测试版本需x.y.z-beta.x，正式版本x.y.z
$ npm run build

# umd上传，dist目录下文件上传至cdn 地址：http://114.55.110.156:8888/files#

# 组件发布（beta）
$ npm publish --tag next

# 组件发布（正式）
$ npm publish