一、开源项目简介

TinyNG

基于 Angular + TypeScript 的企业级 Web UI 组件库。

TinyNG 是基于 Angular + TypeScript 的前端 UI 组件库，旨在为开发人员带来更高效的开发体验和统一的视觉交互风格。TinyNG 已经在华为内部使用四年，支撑数百个企业产品，拥有强大的稳定性和可靠性。

现在，我们将TinyNG开源，让更多的开发人员能够体验它所带来的惊喜和效率提升。如果您正在寻找一款 Angular UI组件库，我们真诚地邀请您来尝试使用TinyNG，并享受它所带来的卓越体验和无限可能。同时，我们也期待您的反馈和建议，让 TinyNG 变得更加完善和易用。我们相信，开源后的 TinyNG 将会得到更多的注重和关注，并且会有更多的人参与其中，为它的发展和壮大做出更大的贡献。

欢迎体验TinyNG ！

二、开源协议

使用MIT开源协议

三、界面展示

四、功能概述

特性

• 70+ 开箱即用的高质量 Angular 组件。
• 支持 OnPush 模式。
• 使用 TypeScript 开发。
• 利用 CSS variables 提供强大的主题配置能力。
• 支持 5 种 国际化语言。

TinyNG 包含了丰富的用户界面组件，非常易于集成和使用。目前，TinyNG 已经开源了 70 多个基础组件，并将逐步开源 100 多个组件，涵盖了企业级全场景，可以满足各种不同领域的需求。

五、技术选型

支持环境

• Angular >=13.0.0
• 现代浏览器

Edge

Firefox

Chrome

Safari

last 3 versions

last 3 versions

last 3 versions

last 2 versions

安装

$ npm install @opentiny/ng

使用

将想要使用的组件模块引入到你的模块中。

import { TiButtonModule } from '@opentiny/ng';

@NgModule({
  imports: [ TiButtonModule ]
})
export class AppModule {
}

然后在 angular.json 文件中引入全局样式文件。

{
  "styles": [
+    "node_modules/@opentiny/ng/themes/styles.css",
+    "node_modules/@opentiny/ng/themes/theme-default.css",
  ]
}

可参考官网 快速上手 了解更多。

开发

$ git clone 代码仓 clone 地址
$ cd ng
$ npm install
$ npm start

浏览器会自动打开。