# @aliceo2/web-ui 中文文档 规范地址：https://npmcn.com/package/%40aliceo2/web-ui/ 版本：2\.12\.0 npm 元数据更新时间：2026-10-14T15:28:12.188Z 中文译文更新时间：2026-11-06T04:32:22.125Z 软件包许可：GPL-3\.0 本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。 原始 npm 页面：https://www.npmjs.com/package/%40aliceo2/web-ui 原文对照：https://npmcn.com/package/%40aliceo2/web-ui/?lang=original 项目主页：https://alice-o2-project.web.cern.ch/ 源码仓库：https://github.com/AliceO2Group/WebUi ## 关键信息（来自 npm 元数据） - 包体积（解压后）：1.1 MB，127 个文件 - 模块格式：CommonJS - TypeScript 类型：未声明 - Node.js 要求：\>= 22\.x - 运行依赖：9 个 - 首次发布：2018-03-15T15:31:07.147Z - 最新版本发布：2026-10-14T15:28:11.858Z - 近 30 天下载量：5144（2026-10-06 至 2026-11-04，npm 官方下载统计） - 已发布版本数：119（近 12 个月 5 个） ## 中文简介 ALICE O2 网络 UX 框架 ## 安装 ```sh npm install @aliceo2/web-ui ``` 也可以使用：`pnpm add @aliceo2/web-ui`、`yarn add @aliceo2/web-ui`、`bun add @aliceo2/web-ui` ## README # 爱丽丝O2个 Web UI 框架 [![Actions Status](https://github.com/AliceO2Group/WebUi/workflows/Framework/badge.svg)](https://github.com/AliceO2Group/WebUi/actions) [![codecov](https://codecov.io/gh/AliceO2Group/WebUi/branch/dev/graph/badge.svg?flag=framework)](https://codecov.io/gh/AliceO2Group/WebUi) [![JIRA](https://img.shields.io/badge/JIRA-issues-blue.svg)](https://alice.its.cern.ch/jira/projects/OGUI) - [ALICE O2 网络用户界面框架](https://npmcn.com/package/%40aliceo2/web-ui/#readme-alice-o2-web-ui-framework) - [概览](https://npmcn.com/package/%40aliceo2/web-ui/#readme-overview) - [服务器侧功能](https://npmcn.com/package/%40aliceo2/web-ui/#readme-server-side-features) - [客户端特性](https://npmcn.com/package/%40aliceo2/web-ui/#readme-client-side-features) - [后端所需经费](https://npmcn.com/package/%40aliceo2/web-ui/#readme-backend-requirements) - [CentOS 8号卫星](https://npmcn.com/package/%40aliceo2/web-ui/#readme-centos-8) - [马科斯](https://npmcn.com/package/%40aliceo2/web-ui/#readme-macos) - [最小浏览器版本支持](https://npmcn.com/package/%40aliceo2/web-ui/#readme-minimum-browser-version-support) - [安装](https://npmcn.com/package/%40aliceo2/web-ui/#readme-installation) - [开始](https://npmcn.com/package/%40aliceo2/web-ui/#readme-getting-started) - [后端引导](https://npmcn.com/package/%40aliceo2/web-ui/#readme-backend-guide) - [前端指南](https://npmcn.com/package/%40aliceo2/web-ui/#readme-frontend-guide) - [参考资料](https://npmcn.com/package/%40aliceo2/web-ui/#readme-references) - [开发者的文档](https://npmcn.com/package/%40aliceo2/web-ui/#readme-documentation-for-developers) ### 概览 该UI框架的目标是确定库和框架集,提供核心功能和构件,以便于创建丰富的网络应用程序 [爱丽丝O2个](https://alice-o2.web.cern.ch/) 项目. #### 服务器侧功能 - REST 和 WebSocket API 软件 - 通过 CERN SSO( OpenID Connect) 认证, 授权使用 CERN 电子组 - JSON Web Tokens确保通信完整性 - 外部资源获取:gRPC,领事 #### 客户端特性 - 根据 ALICE 标准设置的用户界面 CSS 构件 - 同步取取数据( Ajax) 和双向套接字( WebSockets) - MVC 引擎带有“ 潜水” 算法 ### 后端所需经费 - `nodejs` 页:1 #### CentOS 8号卫星 ``` yum install https://rpm.nodesource.com/pub_16.x/el/7/x86_64/nodejs-16.9.1-1nodesource.x86_64.rpm ``` #### 马科斯 ``` brew install node ``` ### 最小浏览器版本支持 - 铬 88 - 火狐 85号 - 边缘89 - 萨法里 14.1 ### 安装 ``` npm install --save @aliceo2/web-ui ``` ### 开始 - [步入教程: 使用 Ajax 和 WebSockets 的时间服务器](https://npmcn.com/package/%40aliceo2/web-ui/docs/tutorial/time-server.md) - [高级前端演示](https://aliceo2group.github.io/WebUi/Framework/docs/demo/frontend.html) ### 后端引导 - [(原始内容存档于2013-10-12) (英语). REST API](https://npmcn.com/package/%40aliceo2/web-ui/docs/guide/http-server.md) - 服务自定义 REST API,支持 TLS - [JSON 网络键](https://npmcn.com/package/%40aliceo2/web-ui/docs/guide/json-tokens.md) - 安全HTTP请求和带有JWT令牌的WebSocket消息 - [日志](https://npmcn.com/package/%40aliceo2/web-ui/docs/guide/logging.md) - 在文件中存储日志消息或将其推向 InfoLogger 服务 - [SSO - OpenID 连接](https://npmcn.com/package/%40aliceo2/web-ui/docs/guide/openid.md) - 通过OpenID连接提供CERN SSO认证 - [WebSocket 服务器](https://npmcn.com/package/%40aliceo2/web-ui/docs/guide/websockets.md) - 使用WebSocket协议提供浏览器和服务器之间的双向通信 - [领事](https://npmcn.com/package/%40aliceo2/web-ui/docs/guide/consul.md) - 领事服务,提供简单的查询 - [吉拉岛](https://npmcn.com/package/%40aliceo2/web-ui/docs/guide/jira.md) - 创建JIRA问题 - [通知服务](https://npmcn.com/package/%40aliceo2/web-ui/docs/guide/notification.md) - 触发并使用Kafka集群接收通知 ### 前端指南 - [模板引擎](https://npmcn.com/package/%40aliceo2/web-ui/docs/guide/template-engine.md) - 使用超标和可观察模型的MVC - [构成部分](https://npmcn.com/package/%40aliceo2/web-ui/docs/guide/components.md) - 拆分和再利用元素 - [缩放应用程序](https://npmcn.com/package/%40aliceo2/web-ui/docs/guide/scale-app.md) - 缩放应用程序的代码 - [调试](https://npmcn.com/package/%40aliceo2/web-ui/docs/guide/debug.md) - 用浏览器工具调试应用程序 - [阿贾克](https://npmcn.com/package/%40aliceo2/web-ui/docs/guide/async-calls.md) - 从服务器同步获取数据 - [WebSocket 客户端](https://npmcn.com/package/%40aliceo2/web-ui/docs/guide/websocket-client.md) - 连接到 WebSocket 服务器 - [路线](https://npmcn.com/package/%40aliceo2/web-ui/docs/guide/front-router.md) - 让您管理一个应用程序中的多页 - [图表](https://npmcn.com/package/%40aliceo2/web-ui/docs/guide/charts.md) - 绘制时间序列 ### 参考资料 - [前端 CSS 软件](https://aliceo2group.github.io/WebUi/Framework/docs/reference/frontend-css.html) - [前端类概览](https://npmcn.com/package/%40aliceo2/web-ui/docs/images/front-arch.dot.png) ### 开发者的文档 - [发展环境](https://npmcn.com/package/%40aliceo2/web-ui/docs/guide/devel.md) ## 常见问题 ### @aliceo2/web-ui 是什么？ ALICE O2 网络 UX 框架 ### 如何安装 @aliceo2/web-ui？ 在项目目录运行 npm install @aliceo2/web-ui，或使用 pnpm add / yarn add / bun add。 ### @aliceo2/web-ui 支持 TypeScript 吗？ 该包的 package\.json 没有声明类型入口。需要类型提示时，可以在 npm 上查找社区维护的 @types/aliceo2\_\_web-ui 是否存在。 ### @aliceo2/web-ui 支持 ESM 还是 CommonJS？ 以 CommonJS 形式发布，可以直接 require\(\)；在 ES Module 项目中也可以用 import 引入（Node\.js 会把 module\.exports 作为默认导出）。 ### @aliceo2/web-ui 需要什么版本的 Node\.js？ package\.json 的 engines 字段要求 Node\.js \>= 22\.x。版本不符时 npm 默认只给出警告，开启 engine-strict 后会拒绝安装。 ### @aliceo2/web-ui 可以商用吗？ @aliceo2/web-ui 使用 GPL-3\.0 许可。强 Copyleft：分发包含该代码的软件时，整个作品需以 GPL-3\.0 兼容许可开源，并附带专利与反锁定条款。仅内部使用不触发此义务。以上为概括，不构成法律意见，请以许可原文为准。 ### @aliceo2/web-ui 的下载量有多少？ 根据 npm 官方下载统计，@aliceo2/web-ui 在 2026/10/06 – 2026/11/04 这 30 天内被下载 5,144 次，日均约 171 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。 ### @aliceo2/web-ui 还在维护吗？ 最新版本 2\.12\.0 发布于 2026/10/14（24 天前）；至今共发布 119 个版本，其中过去 12 个月发布了 5 个；首次发布于 2018/03/15。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。