# @daffodil/design 中文文档 规范地址：https://npmcn.com/package/%40daffodil/design/ 版本：0\.94\.1 npm 元数据更新时间：2026-08-24T16:00:46.296Z 中文译文更新时间：2026-11-14T14:18:49.448Z 软件包许可：MIT 本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。 原始 npm 页面：https://www.npmjs.com/package/%40daffodil/design 原文对照：https://npmcn.com/package/%40daffodil/design/?lang=original 项目主页：https://github.com/graycoreio/daffodil 源码仓库：https://github.com/graycoreio/daffodil ## 关键信息（来自 npm 元数据） - 包体积（解压后）：1.9 MB，257 个文件 - 模块格式：ES Module - TypeScript 类型：包内自带 - 运行依赖：1 个 - peer 依赖：@angular/animations ^21，@angular/common ^21，@angular/core ^21，@angular/forms ^21，@angular/cdk ^21，@daffodil/core 0\.94\.1，@fortawesome/angular-fontawesome ^4\.0\.0，@fortawesome/fontawesome-svg-core ^7\.1\.0，@fortawesome/free-solid-svg-icons ^7\.1\.0，@fortawesome/free-brands-svg-icons ^7\.1\.0，@fortawesome/free-regular-svg-icons ^7\.1\.0，modern-normalize ^3\.0\.1，rxjs ^7\.0\.0 - 首次发布：2019-07-22T18:16:56.551Z - 最新版本发布：2026-08-24T16:00:45.914Z - 近 30 天下载量：2016（2026-10-11 至 2026-11-09，npm 官方下载统计） - 已发布版本数：239（近 12 个月 10 个） ## 中文简介 Angular 组件库是为了支持电子商务应用而建立的,具有无障碍的UI组件和主题. 水仙电子商务框架的一部分. ## 安装 ```sh npm install @daffodil/design ``` 也可以使用：`pnpm add @daffodil/design`、`yarn add @daffodil/design`、`bun add @daffodil/design` ## README # @ 水仙花/ 设计 `@daffodil/design` 是一个角构件库,用于支持电子商务使用案例。 图书馆为各种功能提供统包支持,如: - [预建组件](https://npmcn.com/package/%40daffodil/design/#readme-components) - [他们](https://npmcn.com/libs/design/scss/theming/README.md) - [类型](https://npmcn.com/libs/design/scss/typography/README.md) - [无障碍](https://npmcn.com/libs/design/guides/accessibility.md) - [颜色](https://npmcn.com/libs/design/guides/color.md) ## 软件包 | 软件包 | 版本 | 稳定 | | --- | --- | --- | | [@ 水仙花/ 设计](https://npmcn.com/libs/design/README.md) | [![latest](https://img.shields.io/npm/v/%40daffodil%2Fdesign/latest.svg)](https://npmjs.com/package/@daffodil/design) | [![experimental](https://img.shields.io/static/v1.svg?label=stability&message=experimental&color=orange)](https://www.github.com/graycoreio/daffodil) | 此软件包的来源在 [大水仙仓库](https://github.com/graycoreio/daffodil)。 。 。 . ## 开始 参见 [获取启动指南](https://npmcn.com/libs/design/guides/getting-started.md)。 。 。 . ## 升级 参见 [升级指南](https://npmcn.com/libs/design/guides/upgrading.md)。 。 。 . ## 构成部分 ### 原子 - [按钮](https://npmcn.com/libs/design/button/README.md) - [集装箱](https://npmcn.com/libs/design/container/README.md) - [表单](https://npmcn.com/libs/design/src/atoms/form/README.md) - [复选框](https://npmcn.com/libs/design/src/atoms/form/checkbox/README.md) - [复选框集](https://npmcn.com/libs/design/src/atoms/form/checkbox-set/README.md) - [错误消息](https://npmcn.com/libs/design/src/atoms/form/error-message/README.md) - [窗体字段](https://npmcn.com/libs/design/src/atoms/form/form-field/README.md) - [窗体标签](https://npmcn.com/libs/design/src/atoms/form/form-label/README.md) - [投入](https://npmcn.com/libs/design/src/atoms/form/input/README.md) - [无线电](https://npmcn.com/libs/design/src/atoms/form/radio/README.md) - [无线电集](https://npmcn.com/libs/design/src/atoms/form/radio-set/README.md) - [原生选择](https://npmcn.com/libs/design/src/atoms/form/native-select/README.md) - [数量 外地](https://npmcn.com/libs/design/src/atoms/form/quantity-field/README.md) - [图像](https://npmcn.com/libs/design/image/README.md) - [标记](https://npmcn.com/libs/design/tag/README.md) ### 分子 - [手风琴](https://npmcn.com/libs/design/accordion/README.md) - [条款](https://npmcn.com/libs/design/article/README.md) - [点名](https://npmcn.com/libs/design/callout/README.md) - [纸牌](https://npmcn.com/libs/design/card/README.md) - [英雄们](https://npmcn.com/libs/design/hero/README.md) - [链接集](https://npmcn.com/libs/design/link-set/README.md) - [列表](https://npmcn.com/libs/design/list/README.md) - [媒体图片库](https://npmcn.com/libs/design/media-gallery/README.md) - [模式](https://npmcn.com/libs/design/modal/README.md) - [导航](https://npmcn.com/libs/design/navbar/README.md) - [缓冲器](https://npmcn.com/libs/design/paginator/README.md) - [边栏](https://npmcn.com/libs/design/sidebar/README.md) ## 幕后新闻 - [监察组](https://github.com/graycoreio/daffodil/graphs/contributors) ## 常见问题 ### @daffodil/design 是什么？ Angular 组件库是为了支持电子商务应用而建立的,具有无障碍的UI组件和主题\. 水仙电子商务框架的一部分\. ### 如何安装 @daffodil/design？ 在项目目录运行 npm install @daffodil/design，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：@angular/animations（^21）、@angular/common（^21）、@angular/core（^21）、@angular/forms（^21）、@angular/cdk（^21）、@daffodil/core（0\.94\.1）、@fortawesome/angular-fontawesome（^4\.0\.0）、@fortawesome/fontawesome-svg-core（^7\.1\.0）、@fortawesome/free-solid-svg-icons（^7\.1\.0）、@fortawesome/free-brands-svg-icons（^7\.1\.0）、@fortawesome/free-regular-svg-icons（^7\.1\.0）、modern-normalize（^3\.0\.1）、rxjs（^7\.0\.0）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。 ### @daffodil/design 支持 TypeScript 吗？ 支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。 ### @daffodil/design 支持 ESM 还是 CommonJS？ 以 ES Module 形式发布，推荐使用 import 引入。在 CommonJS 项目中，Node\.js 20\.19\+ / 22\.12\+ 可以直接 require\(\) 不含顶层 await 的 ES Module，更早的版本需要改用动态 import\(\)。 ### @daffodil/design 可以商用吗？ @daffodil/design 使用 MIT 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。 ### @daffodil/design 的下载量有多少？ 根据 npm 官方下载统计，@daffodil/design 在 2026/10/11 – 2026/11/09 这 30 天内被下载 2,016 次，日均约 67 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。 ### @daffodil/design 还在维护吗？ 最新版本 0\.94\.1 发布于 2026/08/25（2 个月前）；至今共发布 239 个版本，其中过去 12 个月发布了 10 个；首次发布于 2019/07/23。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。