# @design-factory/angular 中文文档 规范地址：https://npmcn.com/package/%40design-factory/angular/ 版本：22\.1\.0 npm 元数据更新时间：2026-11-05T15:21:48.848Z 中文译文更新时间：2026-11-12T06:49:36.956Z 软件包许可：BSD-3-Clause 本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。 原始 npm 页面：https://www.npmjs.com/package/%40design-factory/angular 原文对照：https://npmcn.com/package/%40design-factory/angular/?lang=original ## 关键信息（来自 npm 元数据） - 包体积（解压后）：5.4 MB，925 个文件 - 模块格式：ES Module - TypeScript 类型：包内自带 - 运行依赖：5 个 - peer 依赖：esm-env ^1\.2\.1，@angular/core ^22\.0\.0，@angular/forms ^22\.0\.0，embla-carousel ^8\.5\.2，@angular/common ^22\.0\.0，@angular/router ^22\.0\.0，@floating-ui/dom ^1\.6\.12，@angular/localize ^22\.0\.0，@design-factory/styles 22\.1\.0，@amadeus-it-group/tansu ^2\.0\.0 - 首次发布：2026-01-21T16:11:00.654Z - 最新版本发布：2026-11-05T15:21:48.657Z - 近 30 天下载量：2754（2026-10-12 至 2026-11-10，npm 官方下载统计） - 已发布版本数：18（近 12 个月 18 个） ## 中文简介 Amadeus 设计系统 ## 安装 ```sh npm install @design-factory/angular ``` 也可以使用：`pnpm add @design-factory/angular`、`yarn add @design-factory/angular`、`bun add @design-factory/angular` ## README # Amadeus设计厂 ## 说明 设计工厂Angular是包含执行Amadeus设计系统,设计工厂的Angular组件的包. 设计厂(Design Factory)是一种由: - 基于我们四个支柱的Amadeus外部和内部接口及应用程序的UI库 - 一套设计和编码最佳做法 - 来自所有阿玛德乌斯商业单位的跨功能社区 如果你想了解更多关于设计厂的信息,请联系 [设计厂小组](mailto:DesignFactory@amadeus.com)。 。 。 . ## 开始 你可以轻松地在你的项目中添加设计厂图书馆,感谢我们的图表. 运行如下: ```bash ng add @design-factory/angular ``` 它会为您 angular.json 指定的默认应用程序安装设计厂 。 如果您有多个工程并且想要针对特定应用程序, 您可以指定项目选项 ```bash ng add @design-factory/angular --project myProject ``` ## 建筑 设计厂由多个项目组成,您可以安装符合您要求的软件包. - `@design-factory/tokens` 包括增强设计系统能力的设计托肯斯 - `@design-factory/styles` 包括各种风格,包括公用事业和组件风格 - `@design-factory/design-factory` 包括角构件和公用事业。 他们将被迁移到下面的软件包 - `@design-factory/angular` 包含新的 SideNav , 并会增长到包含所有设计厂角构件 ### CSS 命名空间特性 在某些特定情况下,您可能必须使用 CSS 命名空间特性,该特性只允许您在 $df-cs-namespace-selector 变量定义的选择器下应用 DF 样式(默认为 =.deign-factory-v2 ==). 为使用此特性, 请导入以下内容 : ```scss @import '@design-factory/styles/scss/namespace'; ``` 在样式.scs中,并在要应用 DF 样式的 HTML 元素中添加定义的选择器. ## 依赖关系 依赖性是 [角质](https://angular.io/), (中文(简体) ), [靴子陷阱 5](https://getbootstrap.com/), (中文(简体) ), [恩博托丝](https://ng-bootstrap.github.io/), (中文(简体) ), [阿格诺斯UI](https://www.agnosui.dev/), (中文(简体) ), [Ng 选择](https://ng-select.github.io/ng-select#/data-sources), (中文(简体) ), [阿格格丽德](https://www.ag-grid.com/) 财务报告和审定财务报表 [ngx-滑动器](https://angular-slider.github.io/ngx-slider/)。 。 。 . 支持的版本有: | 设计厂 | 角质 | 鞋带CSS | 恩-波茨图 | Ng 选择 | 阿格格丽德 | 阿格诺斯UI | | --- | --- | --- | --- | --- | --- | --- | | 21.0.x (中文(简体) ) | 21.x (中文(简体) ) | 5.3.8 联合国 | 20.0.x (中文(简体) ) | 21.x (中文(简体) ) | 35.x (中文(简体) ) | 0.10.x (英语) | | 22.0.x (中文(简体) ) | 22.x 电话 | 5.3.8 联合国 | 21.0.x (中文(简体) ) | 23.x 电话 | 35.x (中文(简体) ) | 0.11.x (英语) | ## 如何与图标合作 图标是混合 [字体帅呆了](https://fontawesome.com/) (FW)和内部出品相克图. 由于DF 18.0.0发布内部图标和FW图标被分拆成不同的字体. ## 常见问题 ### @design-factory/angular 是什么？ Amadeus 设计系统 ### 如何安装 @design-factory/angular？ 在项目目录运行 npm install @design-factory/angular，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：esm-env（^1\.2\.1）、@angular/core（^22\.0\.0）、@angular/common（^22\.0\.0）、@angular/localize（^22\.0\.0）、@design-factory/styles（22\.1\.0）、@amadeus-it-group/tansu（^2\.0\.0）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。 ### @design-factory/angular 支持 TypeScript 吗？ 支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。 ### @design-factory/angular 支持 ESM 还是 CommonJS？ 以 ES Module 形式发布，推荐使用 import 引入。在 CommonJS 项目中，Node\.js 20\.19\+ / 22\.12\+ 可以直接 require\(\) 不含顶层 await 的 ES Module，更早的版本需要改用动态 import\(\)。 ### @design-factory/angular 可以商用吗？ @design-factory/angular 使用 BSD-3-Clause 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。另外不得用原作者名义为衍生产品背书。以上为概括，不构成法律意见，请以许可原文为准。 ### @design-factory/angular 的下载量有多少？ 根据 npm 官方下载统计，@design-factory/angular 在 2026/10/12 – 2026/11/10 这 30 天内被下载 2,754 次，日均约 92 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。 ### @design-factory/angular 还在维护吗？ 最新版本 22\.1\.0 发布于 2026/11/05（6 天前）；至今共发布 18 个版本，其中过去 12 个月发布了 18 个；首次发布于 2026/01/22。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。