# @aiao/lazy-component

> [![npm][shields-lazy-component]][npm-lazy-component]

Latest version **2.0.0** (published 2023-05-06) · 0 weekly downloads

## Install

```sh
npm install @aiao/lazy-component
pnpm add @aiao/lazy-component
yarn add @aiao/lazy-component
bun add @aiao/lazy-component
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 2.0.0 |
| Published | 2023-05-06 |
| First published | 2019-11-30 |
| Weekly downloads | 0 |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 20.8 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | aiao |

## Links

- npm: https://www.npmjs.com/package/@aiao/lazy-component
- npm.io page: https://npm.io/package/@aiao/lazy-component

## Dependencies (1)

- [tslib](https://npm.io/package/tslib.md) ^2.3.0

## Recent versions

- 2.0.0 (latest) — 2023-05-06
- 1.7.2-alpha.1 (next) — 2022-02-15
- 1.7.2 — 2022-02-21
- 1.7.2-alpha.0 — 2021-12-19
- 1.7.0 — 2021-08-07
- 1.6.0 — 2021-03-09
- 1.5.1-alpha.0 — 2020-08-12
- 1.5.0 — 2020-02-10
- 1.4.0 — 2020-01-14
- 1.3.0 — 2020-01-01
- 1.2.0 — 2019-12-04
- 1.0.0 — 2019-11-30

## README

# @aiao/lazy-component

[![npm][shields-lazy-component]][npm-lazy-component]

按需加载 任意 `module` 的 `component`.

## 场景

弹框弹出任意组件, 在后台页面操作数据时使用非常频繁，可以隔离模块依赖

### ivy 中使用

`ivy` 中也可以使用这种模式，弹框的内容会按 `module` 来分割代码延迟加载

> 需要继承 ICustomElementLazyComponent 接口，实现 customElementComponents 属性

```ts
import { LazyComponentModule, ICustomElementLazyComponent } from '@aiao/lazy-component';
import { NgModule, Type } from '@angular/core';

import { AloneDialogComponent } from './alone-dialog.component';

@NgModule({
  declarations: [AloneDialogComponent],
  imports: [LazyComponentModule]
})
export class AloneDialogModule implements ICustomElementLazyComponent {
  customElementComponents: Type<any>[] = [AloneDialogComponent];
}
```

## 版本

| lazy-module | angular    |
| ----------- | ---------- |
| 1.4         | 8.x - 15.x |
| 2.x         | >= 16.x    |

## 安装

```console
yarn add @aiao/lazy-component
```

## 使用

参考 [dev-lazy-component](../../apps/dev-lazy-component)

[shields-lazy-component]: https://img.shields.io/npm/v/@aiao/lazy-component?label=&style=flat-square
[npm-lazy-component]: https://www.npmjs.com/@aiao/lazy-component

---
_Source: https://npm.io/package/@aiao/lazy-component · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._