open-index/open-npm huggingface dataset:
npm package: @ochmd/ui
Description: 移动端 React 组件库
Latest version: 1.0.0

# @ochmd/ui

移动端 React 组件库

## 安装

```bash
pnpm add @ochmd/ui
```

## 使用

```tsx
import { Button, Input, Popup } from '@ochmd/ui';
import '@ochmd/ui/dist/index.css';

function App() {
  return (
    <>
      <Button type="primary">按钮</Button>
      <Input placeholder="请输入" />
    </>
  );
}
```

## 按需加载

### 自动引入

使用 `babel-plugin-import`：

```bash
pnpm add -D babel-plugin-import
```

配置 `.babelrc` 或 `babel.config.js`：

```json
{
  "plugins": [
    [
      "import",
      {
        "libraryName": "@ochmd/ui",
        "camel2DashComponentName": false
      }
    ]
  ]
}
```

### 手动引入

```tsx
import Button from '@ochmd/ui/es/button';
import '@ochmd/ui/es/button/style';
```

## 主题定制

通过 CSS Variables 定制主题：

```css
:root {
  --primary-color: #1677ff;
  --success-color: #52c41a;
  --warning-color: #faad14;
  --error-color: #ff4d4f;
  --border-radius: 8px;
}
```
npm package: @ocho/components
Description: Storybook, React, Tailwind, and TypeScript are all powerful tools that can be combined to create a powerful web application. Storybook provides developers with a way to quickly prototype and develop components in isolation, while React provides the tools 
Latest version: 0.0.10

## React Storybook With TypeScript and Tailwind for styling

Storybook, React, Tailwind, and TypeScript are all powerful tools that can be combined to create a powerful web application. Storybook provides developers with a way to quickly prototype and develop components in isolation, while React provides the tools to quickly build out a web application. Tailwind provides a library of pre-built UI components and utility classes, while TypeScript adds type safety and autocompletion to the development process. Together, these tools provide developers with the tools they need to quickly and easily build complex, modern web applications.

## Blog Post

Checkout the [**blog post for this project**](https://medium.com/better-programming/build-a-custom-components-with-storybook-7-beta-and-vite-4-in-2023-c52db4d733c0) if you're curious about any of the decisions or how anything was setup:

# Setup

`npm install`

# Start

`npm run storybook`

# Build/Bundle Component Library

`npm run build`

# Build/Bundle Storybook For Deployment

`npm run build-storybook`