Merge pull request #38 from duenyang/main

[Build]构建并支持esm、cjs、umd和按需加载，支持通过less变量和css变量修改主题

.gitignore

@@ -22,3 +22,7 @@ dist-ssr
 *.sln
 *.sw?
 _site
+lib
+es
+esm
+cjs

.vscode/settings.json

@@ -25,5 +25,14 @@
   "editor.codeActionsOnSave": {
     "source.fixAll.eslint": "explicit"
   },
-  "cSpell.words": ["activable", "actived", "borderless", "Cascader", "Popconfirm", "Swiper", "tdesign"]
+  "cSpell.words": [
+    "activable",
+    "actived",
+    "borderless",
+    "Cascader",
+    "Popconfirm",
+    "Swiper",
+    "tdesign"
+  ],
+  "typescript.tsdk": "node_modules/typescript/lib"
 }

README-zh_CN.md

@@ -0,0 +1,97 @@
+<p align="center">
+  <a href="https://tdesign.tencent.com/" target="_blank">
+    <img alt="TDesign Logo" width="200" src="https://tdesign.gtimg.com/site/TDesign.png" />
+  </a>
+</p>
+
+<p align="center">
+   <a href="https://www.npmjs.com/package/tdesign-react">
+    <img src="https://img.shields.io/npm/l/tdesign-react.svg?sanitize=true" alt="License" />
+  </a>
+  <a href="https://app.codecov.io/gh/Tencent/tdesign-react">
+    <img src="https://img.shields.io/codecov/c/github/Tencent/tdesign-react/develop.svg?style=flat-square" alt="codecov">
+  </a>
+  <a href="https://www.npmjs.com/package/tdesign-react">
+    <img src="https://img.shields.io/npm/v/tdesign-react.svg?sanitize=true" alt="Version">
+  </a>
+  <a href="https://www.npmjs.com/package/tdesign-react">
+    <img src="https://img.shields.io/npm/dm/tdesign-react.svg?sanitize=true" alt="Downloads" />
+  </a>
+</p>
+
+简体中文 | [English](./README.md)
+
+TDesign Web Components 适配桌面端的组件库，适合在任何前端项目中使用。
+
+# 🎉 特性
+
+- 适配桌面端交互
+- 基于 [omi](https://github.com/Tencent/omi)
+- 与其他框架/库（Vue / React）版本 UI 保持一致
+- 支持暗黑模式及其他主题定制
+- 支持按需加载
+
+# 📦 安装
+
+```shell
+npm i tdesign-web-components
+```
+
+```shell
+yarn add tdesign-web-components
+```
+
+```shell
+pnpm add tdesign-web-components
+```
+
+# 🔨 基础使用
+
+推荐使用 Webpack 或 Rollup 等支持 tree-shaking 特性的构建工具，无需额外配置即可实现组件按需引入：
+
+```tsx
+import 'tdesign-web-components/lib/button'
+import 'tdesign-web-components/lib/style/index.css'
+
+document.querySelector('#app').innerHTML = `<t-button>Hello TDesign</t-button>`
+```
+
+npm package 中提供了多种构建产物，可以阅读 [这里](https://github.com/Tencent/tdesign/blob/main/docs/develop-install.md) 了解不同目录下产物的差别。
+
+# 快速体验
+
+可以访问官方提供的 [TDesign Starter](https://tdesign.tencent.com/starter/react/) 项目体验使用 TDesign 组件快速搭建业务系统。
+
+# 浏览器兼容性
+
+| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="IE / Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br/> IE / Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br/>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br/>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br/>Safari |
+| ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| Edge >=84                                                                                                                                                                                                        | Firefox >=83                                                                                                                                                                                                      | Chrome >=84                                                                                                                                                                                                   | Safari >=14.1                                                                                                                                                                                                 |
+
+详情参见[桌面端组件库浏览器兼容性说明](https://github.com/Tencent/tdesign/wiki/Browser-Compatibility)
+
+# 其他技术栈实现
+
+- 桌面端 Vue 3 实现：[web-vue-next](https://github.com/Tencent/tdesign-vue-next)
+- 桌面端 Vue 实现： [web-vue](https://github.com/Tencent/tdesign-vue)
+- 移动端小程序实现： [小程序](https://github.com/Tencent/tdesign-miniprogram)
+
+# 参与贡献
+
+TDesign 欢迎任何愿意参与贡献的参与者。如果需要本地运行代码或参与贡献，请先阅读[参与贡献](https://github.com/TDesignOteam/tdesign-web-components/blob/main/DEVELOP_GUIDE.md)。
+
+## 贡献成员
+
+<a href="https://github.com/TDesignOteam/tdesign-web-components/graphs/contributors">
+  <img src="https://contrib.rocks/image?repo=TDesignOteam/tdesign-web-components" />
+</a>
+
+# 反馈
+
+有任何问题，建议通过 [Github issues](https://github.com/TDesignOteam/tdesign-web-components/issues) 反馈或扫码加入用户微信群。
+
+<img src="https://raw.githubusercontent.com/Tencent/tdesign/main/packages/components/src/images/groups/react-group.png" width="200" />
+
+# 开源协议
+
+TDesign 遵循 [MIT 协议](https://github.com/Tencent/tdesign-react/LICENSE)。

README.md

@@ -1 +1,97 @@
-# tdesign-web-components
+<p align="center">
+  <a href="https://tdesign.tencent.com/" target="_blank">
+    <img alt="TDesign Logo" width="200" src="https://tdesign.gtimg.com/site/TDesign.png" />
+  </a>
+</p>
+
+<p align="center">
+   <a href="https://www.npmjs.com/package/tdesign-react">
+    <img src="https://img.shields.io/npm/l/tdesign-react.svg?sanitize=true" alt="License" />
+  </a>
+  <a href="https://app.codecov.io/gh/Tencent/tdesign-react">
+    <img src="https://img.shields.io/codecov/c/github/Tencent/tdesign-react/develop.svg?style=flat-square" alt="codecov">
+  </a>
+  <a href="https://www.npmjs.com/package/tdesign-react">
+    <img src="https://img.shields.io/npm/v/tdesign-react.svg?sanitize=true" alt="Version">
+  </a>
+  <a href="https://www.npmjs.com/package/tdesign-react">
+    <img src="https://img.shields.io/npm/dm/tdesign-react.svg?sanitize=true" alt="Downloads" />
+  </a>
+</p>
+
+English | [简体中文](./README-zh_CN.md)
+
+TDesign Web Components is a UI component and is suitable for use in any front-end project.
+
+# 🎉 Features
+
+- Desktop application interaction
+- High quality UI components based on [omi](https://github.com/Tencent/omi)
+- Consistent API and UI with TDesign component libraries for other frameworks
+- Dark mode and customizable theme
+- Support tree-shaking
+
+# 📦 Installation
+
+```shell
+npm i tdesign-web-components
+```
+
+```shell
+yarn add tdesign-web-components
+```
+
+```shell
+pnpm add tdesign-web-components
+```
+
+# 🔨 Usage
+
+```tsx
+import 'tdesign-web-components/lib/button'
+import 'tdesign-web-components/lib/style/index.css'
+
+document.querySelector('#app').innerHTML = `<t-button>Hello TDesign</t-button>`
+```
+
+The package of tdesign-web-components provides kinds of bundles, read [the documentation](https://github.com/Tencent/tdesign/blob/main/docs/develop-install.md) for the detail of differences between bundles.
+
+# Quick Start
+
+Visit [TDesign Starter](https://tdesign.tencent.com/starter/react/) to experience in the application built with TDesign React UI components.
+
+# Browser Support
+
+| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="IE / Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br/> IE / Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br/>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br/>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br/>Safari |
+| ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| Edge >=84                                                                                                                                                                                                        | Firefox >=83                                                                                                                                                                                                      | Chrome >=84                                                                                                                                                                                                   | Safari >=14.1                                                                                                                                                                                                 |
+
+Read our [browser compatibility](https://github.com/Tencent/tdesign/wiki/Browser-Compatibility) for more details.
+
+# TDesign component libraries
+
+TDesign also provides component libraries for other platforms and frameworks.
+
+- component library for Vue 3.x : [tdesign-vue-next](https://github.com/Tencent/tdesign-vue-next)
+- component library for Vue 2.x : [tdesign-vue](https://github.com/Tencent/tdesign-vue)
+- component library for Wechat miniprogram : [tdesign-miniprogram](https://github.com/Tencent/tdesign-miniprogram)
+
+# Contributing
+
+Contributing is welcome. Read [guidelines for contributing](https://github.com/TDesignOteam/tdesign-web-components/blob/main/DEVELOP_GUIDE.md) before submitting your [Pull Request](https://github.com/TDesignOteam/tdesign-web-components/pulls).
+
+## Contributors
+
+<a href="https://github.com/TDesignOteam/tdesign-web-components/graphs/contributors">
+  <img src="https://contrib.rocks/image?repo=TDesignOteam/tdesign-web-components" />
+</a>
+
+# Feedback
+
+Create your [Github issues](https://github.com/TDesignOteam/tdesign-web-components/issues) or scan the QR code below to join our user groups
+
+<img src="https://raw.githubusercontent.com/Tencent/tdesign/main/packages/components/src/images/groups/react-group.png" width="200" />
+
+# License
+
+The MIT License. Please see [the license file](./LICENSE) for more information.

babel.config.cjs

@@ -0,0 +1,4 @@
+module.exports = {
+  presets: ['@babel/preset-env', '@babel/preset-typescript'],
+  plugins: ['@babel/plugin-transform-runtime'],
+};