https://github.com/tencentyun/iot-panel-component

腾讯连连标准面板组件库
https://github.com/tencentyun/iot-panel-component

iot panel taro

Last synced: 4 days ago
JSON representation

腾讯连连标准面板组件库

• Host: GitHub
• URL: https://github.com/tencentyun/iot-panel-component
• Owner: tencentyun
• Created: 2021-09-22T07:56:51.000Z (about 3 years ago)
• Default Branch: master
• Last Pushed: 2023-04-23T09:50:34.000Z (over 1 year ago)
• Last Synced: 2024-10-12T04:28:30.628Z (about 1 month ago)
• Topics: iot, panel, taro
• Language: TypeScript
• Homepage: https://tencentyun.github.io/iot-panel-component/
• Size: 1.31 MB
• Stars: 1
• Watchers: 45
• Forks: 4
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# qcloud-iot-panel-component

腾讯连连标准面板组件库，支持在 h5 面板和 Taro 小程序中使用。

## H5 使用

```bash

yarn add qcloud-iot-panel-component

```

开始引用组件：

```ts

/* panel.tsx */

// 引入组件库的css

import 'qcloud-iot-panel-component/lib/index.css';

import { BoolWidget } from 'qcloud-iot-panel-component';

```

## 小程序使用

使用 [Taro](https://github.com/NervJS/taro) 的 [HTML编译功能](https://taro-docs.jd.com/taro/docs/use-h5)，我们可以将`qcloud-iot-panel-component`使用在小程序中，在这之前需要先将 Taro 版本升级到 3.3 以上。

1. 在config中配置如下：

```js

  plugins: [

    ['@tarojs/plugin-html', {

      // 包含 `iotp-` 的类名选择器中的 px 单位不会被解析

      pxtransformBlackList: [/iotp-/]

    }]

  ],

```

除了上述配置外，使用方法上与h5相同:

```ts

// 引入组件库的css

import 'qcloud-iot-panel-component/lib/index.css';

import { BoolWidget } from 'qcloud-iot-panel-component';

```

## 开发

```bash

yarn #安装依赖

yarn dev #开发组件

yarn build #打包组件

# 最后执行 yarn docs 可以实时预览组件效果

yarn docs

```

在小程序中使用本地包时，可以执行以下命令：

```bash

# 在组件库目录

yarn build

yarn pack # 生成 qcloud-iot-panel-component-v0.0.xx.tgz

# 在小程序目录下

yarn add path/to/qcloud-iot-panel-component-v0.0.xx.tgz

```