# @meshmakers/shared-services 中文文档

规范地址：https://npmcn.com/package/%40meshmakers/shared-services/

版本：3\.5\.550
npm 元数据更新时间：2026-11-01T19:22:32.228Z
中文译文更新时间：2026-11-01T21:44:56.204Z
软件包许可：未声明

本文由上游 README 机器翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40meshmakers/shared-services
原文对照：https://npmcn.com/package/%40meshmakers/shared-services/?lang=original

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：159 kB，5 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- 运行依赖：1 个
- peer 依赖：@angular/core ^22\.0\.0，@angular/common ^22\.0\.0
- 首次发布：2022-11-13T22:10:56.335Z
- 最新版本发布：2026-11-01T19:22:31.805Z
- 已发布版本数：727（近 12 个月 291 个）

## 中文简介

Angular库提供通用的应用服务，用于消息传递、导航、面包屑和HTTP错误处理。

## 安装

```sh
npm install @meshmakers/shared-services
```

也可以使用：`pnpm add @meshmakers/shared-services`、`yarn add @meshmakers/shared-services`、`bun add @meshmakers/shared-services`

## README

# @meshmakers /共享服务

Angular库提供通用的应用服务，用于消息传递、导航、面包屑和HTTP错误处理。

部分 [@meshmakers](https://www.npmjs.com/org/meshmakers) 包的生态系统。

## 构建和测试

```bash
# Build
npm run build:shared-services

# Lint
npm run lint:shared-services

# Run tests
npm run test:shared-services
```

## 体系结构

```
shared-services/
├── src/
│   ├── public-api.ts
│   └── lib/
│       ├── services/
│       │   ├── message.service.ts          # Notification messages
│       │   ├── app-title.service.ts        # Application title management
│       │   ├── bread-crumb.service.ts      # Breadcrumb navigation
│       │   ├── command.service.ts           # Drawer navigation
│       │   ├── command-base.service.ts      # Navigation base class
│       │   ├── command-settings.service.ts  # Navigation configuration base
│       │   ├── component-menu.service.ts    # Component context menus
│       │   └── error-message.utils.ts       # Error message transformation
│       ├── shared/
│       │   └── mm-http-error-interceptor.service.ts  # HTTP error handling
│       ├── models/
│       │   ├── notification-message.ts      # Message model
│       │   ├── commandItem.ts               # Navigation item model
│       │   ├── breadCrumbData.ts            # Breadcrumb model
│       │   ├── breadCrumbRouteItem.ts       # Route breadcrumb config
│       │   ├── pagedResultDto.ts            # Paged result DTO
│       │   ├── treeItemData.ts              # Tree node model
│       │   ├── apiErrorDto.ts               # API error model
│       │   └── failedDetailsDto.ts          # Error details model
│       ├── data-sources/
│       │   └── entity-select-data-source.ts # Entity autocomplete interface
│       ├── options/
│       │   └── commandOptions.ts            # Command configuration
│       └── compat/                          # Backward compatibility
│           ├── data-source-base.ts          # Legacy DataSourceBase
│           ├── iso-date-time.ts             # Legacy date utilities
│           ├── qr-code-scanner.service.ts   # QR code scanner
│           ├── error-message.ts             # Legacy error model
│           └── auto-complete-data-source.ts # Legacy autocomplete
```

## 服务

| 服务 | 描述 |
| --- | --- |
| `MessageService` | 带有错误历史记录的面向用户的通知（错误、警告、信息、成功） |
| `AppTitleService` | 响应式应用程序标题管理 |
| `BreadCrumbService` | 从路由配置自动生成面包屑 |
| `CommandService` | 抽屉导航管理与Kendo DrawerItem集成 |
| `CommandSettingsService` | 应用程序导航配置的基类 |
| `ComponentMenuService` | 来自路由数据的组件级上下文菜单 |

## 拦截器

| 拦截器 | 描述 |
| --- | --- |
| `MmHttpErrorInterceptor` | 处理HTTP错误（网络错误，403拒绝访问，API 400/409错误详细信息，403） `application/problem+json` 拒绝用他们的 `title`/`detail`);显示他们自己的错误吐司检查的调用者 `MmHttpErrorInterceptor.reportsToUser(error)` 第一个 |

## 模型

| 模型 | 描述 |
| --- | --- |
| `NotificationMessage` | 带有级别、消息、详细信息、时间戳的消息 |
| `CommandItem` | 导航项链接/href/onClick，可见性，子 |
| `BreadCrumbRouteItem` | 路由面包屑配置标签/url/图标 |
| `BreadCrumbData` | 剑道兼容面包屑项目 |
| `PagedResultDto` | 使用skip/take/totalCount/list分页结果 |
| `TreeItemData` | 树节点接口 |
| `EntitySelectDataSource` | 用于实体自动完成数据源的接口 |

## 快速入门

```typescript
// app.config.ts
import { provideMmSharedServices, MmHttpErrorInterceptor } from '@meshmakers/shared-services';
import { HTTP_INTERCEPTORS } from '@angular/common/http';

export const appConfig: ApplicationConfig = {
  providers: [
    provideMmSharedServices(),
    { provide: HTTP_INTERCEPTORS, useClass: MmHttpErrorInterceptor, multi: true }
  ]
};
```

## 详细的文档

看到 [文档/ README.md](https://npmcn.com/package/%40meshmakers/shared-services/docs/README.md) 获取完整的API参考以及所有服务的使用示例。

## 依赖关系

-   **角21** （core, common/http, router）
-   **RxJS** （行为主体，主体，可观察性）
-   **@progress / kendo-angular-layout** (DrawerItem)
-   **@progress / kendo-angular-menu** (子菜单)
-   **@progress / kendo-angular-navigation** (BreadCrumbItem)
-   **@progress / kendo-svg-icons** (SVGIcon)

## 文件和测试标准

-   **所有开发人员文档必须用英语编写**
-   **每次代码更改都必须包含更新的文档** -更新自述文件。医学博士,文档/ README。在添加、修改或删除功能时使用
-   **必须执行单元测试和集成测试** 每次代码更改之后
-   **必须更新现有的测试** 当被测试代码的行为发生变化时
-   **必须添加新的测试** 当实现新的特性、组件或服务时
-   永远不要提交测试失败的代码

## 常见问题

### @meshmakers/shared-services 是什么？

Angular库提供通用的应用服务，用于消息传递、导航、面包屑和HTTP错误处理。

### 如何安装 @meshmakers/shared-services？

在项目目录运行 npm install @meshmakers/shared-services，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：@angular/core（^22\.0\.0）、@angular/common（^22\.0\.0）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @meshmakers/shared-services 支持 TypeScript 吗？

支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。

### @meshmakers/shared-services 支持 ESM 还是 CommonJS？

以 ES Module 形式发布，推荐使用 import 引入。在 CommonJS 项目中，Node\.js 20\.19\+ / 22\.12\+ 可以直接 require\(\) 不含顶层 await 的 ES Module，更早的版本需要改用动态 import\(\)。

### @meshmakers/shared-services 可以商用吗？

@meshmakers/shared-services 使用 未声明 许可。package\.json 没有声明许可证。没有许可证的代码默认保留全部权利，商用前请联系作者或查看仓库中的 LICENSE 文件。以上为概括，不构成法律意见，请以许可原文为准。

### @meshmakers/shared-services 还在维护吗？

最新版本 3\.5\.550 发布于 2026/11/02（1 天前）；至今共发布 727 个版本，其中过去 12 个月发布了 291 个；首次发布于 2022/11/14。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。