Web前端组件库OpenTiny项目如何使用

目前华为云出品的开源项目OpenTiny其中包含两个组件库项目一个是TinyVue还有一个是TinyNG当然还包含拥有主题配置系统/中后台模板/TinyCLI 命令行等效率提升工具

接着说下TinyVue是如何使用的：其实非常简单。

1 将TinyVue导入您的项目中。您可以通过npm或者手动下载方式将TinyVue导入您的项目中。

2 创建一个Vue实例。您可以在Vue实例中注册TinyVue的组件，以便在您的应用程序中使用这些组件。

3 在Vue实例中使用组件。您可以在Vue模板中使用TinyVue组件，以便在您的应用程序中显示这些组件。 例如，假设您已经将TinyVue导入您的项目中，并已经创建了一个Vue实例，现在您可以按照以下方式在模板中使用TinyVue的Button组件：

以上代码展示了如何在Vue模板中使用TinyVue的Button组件。在模板中，可以像使用普通的HTML元素一样使用TinyVue的组件，同时也可以为它们设置事件监听器，以便在用户与这些组件交互时，对这些事件进行响应。

再说下TinyNG是如何使用的：

1 下载并导入TinyNG组件库的CSS和JS文件到项目中。

2 在HTML文件中引入相关的CSS和JS文件。

3 在页面中使用组件库提供的组件和工具。

例如，使用按钮组件：

当然，除了按钮组件，还有很多其他的组件和工具，可以根据实际需求使用。

其实具体的可以直接进入OpenTiny官网 里面有具体的文档说明并提供了详细的组件和工具的使用说明和示例代码，使用起来也是非常方面。现如今组件库其实非常多，OpenTiny核心优势也是非常明显。所以大家感兴趣也可以去尝试下。

说到Web前端组件库，OpenTiny其实是个非常不错的选择，具体说起来，首先想到的就是组件丰富：主要有70+基础组件，1500+组件API，接口、功能和细节配置都是非常丰富的，同时Table、Tree、Select等高频组件均内置虚拟滚动，在10万大数据场景下保持丝滑体验，性能是非常高的。然后就是TinyVue采用组件与框架分离的设计理念，将组件逻辑抽离成纯函数，实现跨端、跨框架、跨版本，灵活可配，适应未来。同时两个组件库是涵盖 Vue2/Vue3/Angular 多技术栈。并且支持数据驱动的配置式使用方式。最后其实TinyVue和TinyNG两个组件库都可以称得上企业级安全保障，所有接口杜绝 XSS 攻击，100% 安全放心，节省代码看护成本。并且组件库使用也是非常稳定的，经过九年持续打磨，服务于上千个项目，千锤百炼，稳定可靠。

如果你OpenTiny 的开源项目感兴趣，也可以添加小助手微信：opentiny-official，拉你进群，一起交流前端技术，一起玩开源。

首先，OpenTiny是一个开源的Angular技术栈UI组件库，由OpenTiny团队开发和维护，旨在为企业级应用提供高质量、高效率、高稳定性的UI组件和解决方案。OpenTiny提供了70多个Angular组件，支持OnPush模式、CSS变量主题定制、7种语言国际化等功能。

其次，OpenTiny是在2021年10月份正式开源的，目前已经发布了002版本，遵循MIT协议。 OpenTiny的源码和文档都托管在GitHub上。

OpenTiny的GitHub地址如下：

OpenTiny主页：>

OpenTiny-ng仓库：>

最后，如果您想要使用OpenTiny-ng组件库，您需要满足以下条件：

使用Angular ^1400或以上版本

使用现代浏览器，如Edge、Firefox、Chrome、Safari等

如果您符合以上条件，并且对OpenTiny-ng组件库感兴趣，您可以通过以下方式安装和使用：

通过npm安装：$ npm install @opentiny/ng

在模块文件中导入需要使用的组件模块：import { TiButtonModule } from ‘@opentiny/ng’;

在angularjson中导入样式文件链接："styles": [ "node_modules/@opentiny/ng/themes/stylescss", "node_modules/@opentiny/ng/themes/theme-defaultcss", ]

RTX51 Tiny 用于管理目标系统的资源，本章讨论RTX51 Tiny如何使用这些资源。 RTX51 Tiny 用标准8051的定时器0（模式1）生产一个周期性的中断。该中断就是RTX51 Tiny的定时滴答（Timer Tick）。库函数中的超时和时间间隔就是基于该定时滴答来测量的。

默认情况下，RTX51每10000个机器周期产生一个滴答中断，因此，对于运行于12MHZ的标准8051来说，滴答的周期是001秒，也即频率是100HZ(12MHz/12/10000)。该值可以在CONF_TNYA51配置文件中修改。

附注：

l可以在RTX51的定时滴答中断里追加自己的代码。参见CONF_TNYA51 配置文件。

l关于RTX51 Tiny如何使用中断可以参考概述中中断一节的叙述。 RTX51 Tiny本质上是一个任务切换器，建立一个RTX51 Tiny程序，就

是建立一个或多个任务函数的应用程序。下面的信息可以帮助你快速的理解

RTX51 。

l任务用新的关键字由C语言定义，该关键字是Keic C51 所支持的。

lRTX51 Tiny维护每个任务的正确状态（运行、就绪、等待、删除、超时）。

l某个时刻只有一个任务处于运行态。

l任务可能处于就绪态、等待态、删除态或超时态。

l空闲任务（Idle_Task）总是处于就绪态，当定义的所有任务处于阻 塞状态时，运行该任务。 每个RTX51 Tiny 任务总是处于下述状态中的一种状态中。 状态 描 述 运行 正在运行的任务处于运行态。某个时刻只能有一个任务处于该状态。

os_running_task_id 函数返回当前正在运行的任务编号。 就绪 准备运行的任务处于就绪态。一旦运行的任务完成了处理，RTX51 Tiny选择一个就绪的任务执行。一个任务可以通过用os_set_ready或os_set_ready函数设置就绪标志来使其立即就绪（即便该任务正在等待超时或信号）。 等待 正在等待一个事件的任务处于等待态。一旦事件发生，任务切换到就绪态。Os_wait函数用于将一个任务置为等待态。 删除 没有被启动或已被删除的任务处于删除态。Os-delete-task函数将一个已经启动（用os_create_task）的任务置为删除态。 超时 被超时循环中断的任务处于超时态，在循环任务程序中，该状态相当于就绪态。 在实时 *** 作系统中，事件可用于控制任务的执行，一个任务可能等待一个事件，也可能向其他任务发送任务标志。

os_wait函数可以使一个任务等待一个或多个事件。

l超时是一个任务可以等待的公共事件。超时就是一些时钟滴答数， 当一个任务等待超时时，其他任务可以执行。一旦到达指定数量的滴答数，任务就可以继续执行。

l时间间隔（Interval）是一个超时（Timeout）的变种。时间间隔与超

时类似，不同的是时间间隔是相对于任务上次调用os_wait函数的指定数量的时钟滴答数。

l信号是任务间通信的方式。一个任务可以等待其他任务给它发信号（用os_send_signal和isr_send_signal函数）。

l每个任务都有一个可被其它任务设置的就绪标志（用os_set_ready和

isr_set_ready函数)。一个个等待超时、时间间隔或信号的任务可以通过设置它的就绪标志来启动。

lisr_set_ready函数）。一个等待超时、时间间隔或信号的任务可以通 过设置它的就绪标志来启动。

下表是os_wait函数等待的事件： K_IVL 等待制定的时间 隔K_SIG 等待一个信号 K_TMO 等待指定的超时 os-wait返回时，返回值表明发生了的事件： 返回值 意 义 RDY_EVENT 任务的就绪标志被置位 SIG_EVENT 收到一个信号 TMO_EVENT 超时完成或时间间隔到达。 os_wait可以等待下面的事件组合：

lK_SIG︱K_TMO:任务延迟直到有信号发给它或者指定数量的时钟滴答

到达。

lK_SIG︱K_IVL:任务延迟直到有信号到来或者指定的时间间隔到达。

附注：

lK_IVL和K_TMO事件不能组合 任务调度程序给任务分配处理器，RTX51 Tiny调度程序用下列规则确定

哪个任务要被运行：

当前任务被中断如果：

1、任务调用了os_switch_task且另一个任务正准备运行。

2、任务调用了os_wait且指定的事件没有发生。

3、任务执行了比轮转时间片更长的时间。

另一个任务启动如果：

1、无其它任务运行。

2、要启动的任务处于就绪态或超时态。 RTX51 Tiny可以配置为用循环法进行多任务处理（任务切换）。循环法允许

并行的执行若干任务。任务并非真的同时执行，而是分时间片执行的（CPU时间分

成时间片，RTX51 Tiny给每个任务分配一个时间片）。由于时间片很短（几毫秒），

看起来好象任务在同时执行。

任务在它的时间片内持续执行（除非任务的时间片用完）。然后，RTX51 Tin

g切换到下一个就绪的任务运运行。时间片的持续时间可以通过RTX51 Ting配置

定义。

下面是一个RTX51 Tiny程序的例子，用循环法多任务处理，程序中的两个任务

是计数器循环。RTX51 Tiny在启动时执行函数名为job0的任务0，该函数建立了另

一个任务job1，在job0执行完它的时间片后， RTX51 Tiny切换到job1。在job1执

行完它的时间片后，RTX51 Ting又切换到job0，该过程无限重复。

#include

int counter0;

int counter1;

void job0(void) _task_ 0

﹛

os_create(1); /标记任务1为就绪/

while(1)

﹛ /无限循环/

counter0++; /更新记数器/

}

}

void job1(void) _task_1

﹛

while(1)

﹛ /无限循环/

counter++; /更新记数器/

}

}

附注:

l可以用os_wait 或os_switch_task让RTX51 Tiny切换到另一个任务而不是

等待任务的时间片用完。 os_wait函数挂起当前的任务（使之变为等待态）直

到指定的事件发生（接着任务变为就绪态）。在此期间，任意数量的其他任务

可以运行。 如果禁止了循环任务处理，就必须让任务以协作的方式运作，在每个任务

里调用os_wait或os_switch_task，以通知RTX51 Tingy切换到另一个任务。

os_wait与os_switch_task的不同是，os_wait是让任务等待一个事件，而

os_switch_task是立即切换到另一个就绪的任务。 没有任务准备运行时，RTX51 Ting执行一个空闲任务。空闲任务就是一个

无限循环。如：

SJMP$

有些8051兼容的芯片提供一种降低功耗的空闲模式，该模式停止程序的执

行，直到有中断产生。在该模式下，所有的外设包括中断系统仍在运行。

RTX51 Tiny允许在空闲任务中启动空闲模式（在没有任务准备执行时）。当

RTX51 Tiny的定时滴答中断（或其它中断）产生时，微控制器恢复程序的执行。

空闲任务执行的代码在CONF_TNYA51配置文件中允许和配置。 RTX51 Tiny为每个任务在8051的内部RAM区（IDATA）维护一个栈。任务

运行时，将得到可能得到的最大数量的栈空间。任务切换时，先前的任务栈被

压缩并重置，当前任务的栈被扩展和重置。

下图表明一个三任务应用的内部存储器的布局。

图略…… :-)

？STACK表示栈的起始地址。该例中，位于栈下方的对象包括全局变量、寄存器和位寻址存储器，剩余的存储器用于任务栈。存储器的顶部可在配置中指定

tiny免流混淆是host。根据查询相关资料信息，混淆参数：就是可以免流量的网址，就是运营商的白名单网址host。inyApp是一个使用Node和Express构建的全栈Web应用程序，它允许用户缩短长URL。

给你些相关设置选项的：

软件设置：

（一）、系统图标及四个模块

右键点击Tiny Firewall Pro 系统栏图标，可以看到它主要有以下四个模块：Windows Security、Firewall、IDS/IPS、Integrity Guard，你可以在这里启用/禁用某一模块；也可以到 Administration Center（管理中心）里进行具体设置。

1、Windows Security（Windwos 安全）

Windows Security 是Tiny的主要特色之一。它可以根据MD5、文件名、程序完整路径等来识别程序的合法性，并决定该程序是否可以运行（不管它是不是要连网）。

有效利用Windows Security有助于帮你发现和拦截未知的新病毒或木马。

该模块对应着“管理中心”的Applications（应用程序）部分。如果你取消Windows Security 的“打勾”选择，那么管理中心 Application 部分的设置将不会起什么作用（以下模块与此类似）。

2、Firewall（防火墙）

Tiny的防火墙功能，主要用来管理网络与本机的通讯。

对应着管理中心的Access To/From This Computer （访问本机）和Routed Connections（路由连接）。

3、IDS/IPS（入侵检测系统/入侵防护系统）

Tiny Firewall Pro 的入侵检测及防护系统。

对应着管理中心的IDS & IPS。

4、Integrity Guard(完整性卫士)

主要用来保护文件、注册表键值、DLL、OLE/COM、系统服务、设备等的完整性。

对应着管理中心的File Protection（文件保护）和 System Protection（系统保护）。

（二）Administration Center（管理中心）

Tiny Firewall Pro 的设置核心所在。管理中心采用网页的方式来存取设置数据，所做的改动都会立即有效；且没有“应用”、“撤销”之类的按钮，所以 *** 作时要谨慎。

右键点击Tiny的系统栏图标，选“Run Adminstration Center”进入管理中心。可以看到管理中心界面左侧分9个部分。

1、Applications（应用程序）―― 隶属于 Windows Security 模块

Tiny的一个强大之处就在于它可以事无巨细的掌管系统的所有程序；每运行一个程序，Tiny都会根据你预先做好的设置来决定该程序是运行、拦截，还是到时由你来决定如何 *** 作。

如果对这部分功能感到麻烦；可以右键点击Tiny系统栏图标处，取消Windows Security 模块；这样的话你运行任何不连网的程序 Tiny 都不会提示（但不提倡）。

（1）My Applications（我的程序）

该部分主要是对各应用程序进行分组设置，以便于管理。

组（Group）

为了便于管理成千上万个应用程序，Tiny对程序进行了分组。

点击Selected Group右边的第二个下拉箭头，可以看到默认的分组如下：

每一组对应着不同的运行授权（即每个组具体可以干什么）。

你可以点击小红叉把某个组删掉（但不建议那么做）；也可以点击Add New Groups来新建一个组。

最常用的组是Trusted（被信任的组），默认Tiny会允许隶属于Trusted的程序进行任何 *** 作。所以，你要信任一个程序前必须确信它毫无问题。

应用程序（Application）

建好各个组之后，就可以把各个程序划分到各个组中。

Tiny安装后已经自动添加了一些程序并对它们进行了分组。点击程序右边的Edit按钮可以对它进行编辑（或选择Remove from Groups 进行删除）。

在Tiny中，主要是根据以下特征来识别一个程序：（单选）

①Checksum：检验和；这里指的是程序的MD5值；

②Path：程序所在的完整路径；

③Filename：文件名；

④Checksum and path：MD5及文件完整路径；

⑤Checksum and filename：MD5及文件名。

通常选择第一项即可。

也可以使用 Enroll Exe or DLL（注入Exe或DLL文件；通常某些程序会调用其它的EXE或DLL文件）或Generate Applications or DLLs（普通应用程序/动态链接库）来新建一个程序并对它进行分组：

是不是每个程序都要手工添加呢？当然不是。没有在此处设置的程序，Tiny还有专门的处理方法：Application Start Control 的Unknown Application Policy设置。

（2）Application Start Control（程序启动控制）

My Applications 部分是对程序进行分组；而Application Start Control部分则是对于组及程序的行为许可进行设置。

在Unknown Application Policy（未知程序策略）下有两个项目：Regular Application Start（普通程序启动）、System Application Start（系统程序启动），默认选项为Run（运行）。

这里Run的意思是：对于未知程序，Tiny先运行，然后再根据程序的活动来决定自动继续运行或自动拦截等（跟一些杀软对待病毒的方法类似，呵呵）。这个设置看起来似乎很方便；但这样一来Tiny会自作主张的处理那些程序，而且这期间不允许用户进行干预，所以往往会“误杀”一些程序（比如QQ等）。这里有两种方案可供参考：

A、继续选择Run，然后在My Applications中把被Tiny拦截的“无辜”程序添加到Trusted组中即可。

B、我的选择是Ask Me，由自己来决定该如何做。选择Ask me 后，每运行一个程序，都会出现诸如此类的对话框：

可以由用户来根据显示的完整路径、MD5值等来决定如何处理这个程序：

①没有问题的程序：建议选择Trust this Application来自动把它添加到信任组中去。

②安装程序：Run With No Security。

③有问题的程序：可以选择Do Not Run（不运行）或 Move to Quarantine folder（隔离）来禁止它运行。

④无法确信是否有问题的程序：Run with Default Security。熟练的用户也可以使用Track‘n Reverse 来跟踪它。

你还可以对而Application Start Control已存在的设置进行删除、编辑等；也可以按 Add New Acount Specific Rule或Add New Rule 来新建一个规则。

在新建规则的对话框中，Application 的 Start By 可选择预先设好的组或具体程序：

2、Access To/From This Computer（访问计算机）――隶属于 Firewall 模块

这跟其它防火墙设置类似，无非是些IP地址、协议之类的，因此不再详述。

3、Routed Connections（路由连接）――隶属于 Firewall 模块

用于设置 局域网计算机 <——>网关<——>远程计算机 之间的通讯。包括General Rules（普通规则）、NAT/ICS Setting（NAT/ICS 设置）。

普通个人用户很少用到这个。

注：

ICS（Internet Connection Sharing），Internet连接共享，也称为Internet转换连接。

NAT（Network Address Translator），网络地址转换，也称为Internet的路由连接。

4、IDS & IPS――隶属于 IDS 模块

IDS：入侵检测系统

IPS：入侵防护系统

常用的网络安全技术之一。

在Tiny的这个模块中，无法添加或删除规则，只能启用、禁用，或对已存在规则进行编辑：

5、File Protection（文件保护）――隶属于Integrity Guard模块

在这里建立一个规则来保护你的文件不被读取（Read）、建立（Create）、写入（Write）或删除（Delete）等：

6、System Protection（系统保护）――隶属于Integrity Guard模块。

除了对文件进行保护，Tiny还可以保护你的注册表键值、DLL、OLE/COM、系统服务、设备、系统权限等。

7、Setting

管理中心的设置。

（1）Protocols and Ports：在这里预设协议和端口。

（2）Predefined IP Addresses： 预设IP地址。

（3）Time Intervals：预设时间间隔。

（4）Backup/Restore：把你的设置备份起来，必要的时候可以从中恢复。

（5）Options：管理中心的总体选项；在这里还可以设置管理中心的界面等。

比如你可以通过设置让Tiny管理中心界面看起来更像ZoneAlarm：

（6）Track‘n’Reverse Mode Settting：反向跟踪模式设置。

8、Reports

查看Tiny记录的事件日志。

9、Help

帮助。Tiny的帮助是连到官方网页查看的。

（三）Activity Monitor（活动监控器）

使用Activity Monitor可以查看即时事件日志、网络连接及正在运行的进程等。也是Tiny的重要组成部分之一。右键点击具体项目，可以进行相关 *** 作：

默认Activity Monitor是随Windows自启动的；可以点击Activity Monitor左上角的Options项进行设置，取消 Launch Activity Monitor automatically选项即可：

（四）其它

Tiny 还有一个TrackLog Analyzer（跟踪日志分析器）及Checksum Scanner（校验和扫描器，可以点击 Update Known Applications 打开）。在此不再叙述。

tinyint在JAVA中对应是byte型

java:Java是一种可以撰写跨平台应用软件的面向对象的程序设计语言。Java 技术具有卓越的通用性、高效性、平台移植性和安全性，广泛应用于PC、数据中心、游戏控制台、科学超级计算机、移动电话和互联网，同时拥有全球最大的开发者专业社群。

tinyint:TINYINT ，字段类型，如果设置为UNSIGNED类型，只能存储从0到255的整数,不能用来储存负数。

你好，TinyCLI这个项目应该是在2023年3月份正式开源。

最近华为云开源了一个前端组件库项目OpenTiny，这个里面不仅包含有两个组件库项目，一个是TinyVue另外一个是TinyNG,当然除此之外还有一个脚手架工具是TinyCLI， TinyCLI是一个跨平台的前端工程化cli工具。 为开发者提供一系列开发套件及工程插件，覆盖前端开发的整个链路， 保证团队开发过程的一致性和可复制性。

首先TinyCLI作为一个脚手架工具集拥有以下几个明确的特点

1、 可以自动化安装与升级，只需要一次安装，后续工具主程序更新可在线自动完成，无需手动更新；开发套件和效率工具插件无需手动安装和升级，程序自行判断当前环境是否已安装或存在最新版本，升级过程中版本升级日志清晰可见。

2、 友好的系统提示及自动修复能力，捕获工具运行过程常见的错误，输出个性化友好提示，部分错误集成自动修复能力，如安装包漏装自动安装，端口占用自动切换等。

3、 增强版任务流机制，类似npm scripts的任务机制，但功能比npm更加强大，支持同步和异步两种任务执行方式，任务命令支持windows/linux/mac多个平台，无需额外判断，系统自动处理。

以上介绍了TinyCLI的特性，整体来讲就是CLI工具可构建Web业务开发最佳解决方案。

对于OpenTiny开源项目的TinyCLI工具，我也添加了小助手微信：opentiny-official，想要了解更多的话也可以添加下，有需要也可以一起交流前端技术，一起玩开源。