Skip to content

Commit

Permalink
Merge pull request #112 from heluxjs/doc-old
Browse files Browse the repository at this point in the history
chore: recover doc-old
  • Loading branch information
fantasticsoul authored Jan 6, 2024
2 parents a13ca98 + 0873cb7 commit 526dc31
Show file tree
Hide file tree
Showing 192 changed files with 10,515 additions and 0 deletions.
26 changes: 26 additions & 0 deletions doc/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
# Dependencies
/node_modules

# Production
/build

# Generated files
.docusaurus
.cache-loader
package-lock.json

# Misc
.DS_Store
.env.local
.env.development.local
.env.test.local
.env.production.local

npm-debug.log*
yarn-debug.log*
yarn-error.log*

tmp
# docs/tutorial-basics
# docs/tutorial-extras

41 changes: 41 additions & 0 deletions doc/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
# Website

This website is built using [Docusaurus 2](https://docusaurus.io/), a modern static website generator.

### Installation

```
$ yarn
```

### Local Development

```
$ yarn start
```

This command starts a local development server and opens up a browser window. Most changes are reflected live without having to restart the server.

### Build

```
$ yarn build
```

This command generates static content into the `build` directory and can be served using any static contents hosting service.

### Deployment

Using SSH:

```
$ USE_SSH=true yarn deploy
```

Not using SSH:

```
$ GIT_USER=<Your GitHub username> yarn deploy
```

If you are using GitHub pages for hosting, this command is a convenient way to build the website and push to the `gh-pages` branch.
3 changes: 3 additions & 0 deletions doc/babel.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
module.exports = {
presets: [require.resolve('@docusaurus/core/lib/babel/preset')],
};
14 changes: 14 additions & 0 deletions doc/blog/2022-05-05-hel-remote-call.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
---
slug: hel-remote-call
title: show hel remote call
authors: [fantasticsoul]
tags: [hel]
---

show helux

:::tip

Use the power of React to create interactive blog posts.

:::
5 changes: 5 additions & 0 deletions doc/blog/authors.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
fantasticsoul:
name: fantasticsoul
title: hel-micro maintainer
url: https://github.com/fantasticsoul
image_url: https://avatars.githubusercontent.com/u/7334950?v=4
13 changes: 13 additions & 0 deletions doc/blog/fancy-intro.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
---
slug: change1
title: fantasticsoul intro
author: fantasticsoul
author_title: tencent frontend engineer
author_url: https://github.com/fantasticsoul
author_image_url: https://avatars.githubusercontent.com/u/7334950?v=4
tags: [hel-micro]
---

## 更新

主要做了 xxx 更新
3 changes: 3 additions & 0 deletions doc/docs/api/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
## menu order

- quick-start
5 changes: 5 additions & 0 deletions doc/docs/api/action/_category_.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
{
"collapsible": true,
"collapsed": true,
"position": 5
}
64 changes: 64 additions & 0 deletions doc/docs/api/action/app-ready.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,64 @@
---
sidebar_position: 5
---

# appReady

`appReady`是服务于模块提供方的接口,用于运行时将当前模块的需暴露的应用根组件(react 项目、vue 项目等)提供给其他项目(即远程模块的使用方)

## 基本用法

### 暴露模块对象

仅指定模块组名暴露对象

```ts
async function main() {
const { appReady } = await import('hel-lib-proxy');
const { LIB_NAME } = await import('./configs/subApp');

const App = await import('./App'); // 项目根组件
appReady(LIB_NAME, App);
}

main().catch(console.error);
```

### 指定平台值

暴露的模块默认属于`unpkg`平台,当用户有自定义平台时,可指定具体的平台值暴露模块

```ts
appReady('xxx', App, { platform: 'myplat' });
```

之后模块使用方使用[preFetchApp](/docs/api/hel-micro/prefetch-app)接口加载该项目根组件时,就需要指定相同的平台值才能正常拉取到

```ts
preFetchApp('xxx', { platform: 'myplat' });
```

### 指定版本号

通常情况下 sdk 会从加载当前模块的链接里推导出模块对应的版本号

```bash
# 以下链接会推导出版本号 1.1.3
https://unpkg.com/[email protected]/hel_dist/hel-meta.json
```

当用户做一些私有化部署或有自己的版本号定义规则时,可指定版本号后暴露模块

```ts
appReady('xxx', App, { versionId: 'v1-prerelase' });
// 发布后使用方之后可指定对应版本号加载
preFetchApp('xxx', { versionId: 'v1-prerelase' });
```

### 指定应用名

初始状态下,[应用名与应用组名](docs/api/basic/glossary#应用名与应用组名)是一致的,在存在对同一套代码除了按版本这个维度之外的更多加载场景的诉求时,可指定应用名暴露根组件

```ts
appReady('xxx', App, { appName: 'xxx-dev' });
```
18 changes: 18 additions & 0 deletions doc/docs/api/action/create-instance.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
---
sidebar_position: 3
---

# createInstance

使用`createInstance`可用于按需重设符合自己需求的默认平台值,该接口会返回的一个 api 对象,使用该对象调用的任何方法都将使用重设的平台值,可基于此接口定制自己的`hel-lib-proxy`包发布到 npm 方便其他项目复用。

## 基础用法

### 设置默认值

```ts
import { createInstance } from 'hel-lib-proxy';

const ins = createInstance('myplat');
// 调用 ins.libReady 将默认使用 myplat 平台值
```
37 changes: 37 additions & 0 deletions doc/docs/api/action/event-bus.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
---
sidebar_position: 4
---

# eventBus

使用`eventBus`可方便的在主应用和子模块之间进行事件通信

:::tip 不同包的 eventBus 也可以相互通信

`hel-lib-proxy`包导出的`eventBus``hel-micro`包导出的`eventBus`相互间也是可以进行事件通信的

:::

## 基础用法

### 发射事件

```ts
import { eventBus } from 'hel-lib-proxy';
eventBus.emit('evName', ...args);
```

### 监听事件

```ts
const cb = (...args) => {
/** your logic */
};
eventBus.on('evName', cb);
```

### 取消监听

```ts
eventBus.off('evName', cb);
```
72 changes: 72 additions & 0 deletions doc/docs/api/action/expose-lib.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,72 @@
---
sidebar_position: 1
---

# exposeLib

`exposeLib`是服务于模块提供方的接口,在`rollup`打包入口文件使用,用于将代码的类型与代理对象暴露出去,具体使用可参考此[libTypes](https://github.com/hel-eco/hel-tpl-remote-lib/blob/master/src/entrance/libTypes.ts)文件。

## 基础用法

### 暴露模块代理对象

暴露代理对象并使用 rollup 打包发布到 npm 后,使用方先使用[preFetchLib](/docs/api/hel-micro/prefetch-lib)做预加载,然后就可以安全的静态导入

- 提供方

```ts
import { exposeLib } from 'hel-lib-proxy';
import { LIB_NAME } from 'configs/subApp';

export const lib = exposeLib(LIB_NAME);
export default lib;
```

-使用方

```ts
// 入口文件出预加载运行时代码
await preFetchLib('xxx');

// 其他文件里静态导入模块代理对象
import xxx from 'xxx'; // 实际运行代码将由 preFetchLib 填充

xxx.callRemoteMethod(); // 这里即可安全的调用远程方法
```

### 暴露模块类型

对于 ts 工程,建议连同类型一起暴露,方便调用方获得友好的 IDE 智能提示,提高开发体验

```ts
import type { LibProperties } from './libProperties'; // 此处仅导出类型,不会影响rollup的打包体积
import { exposeLib } from 'hel-lib-proxy';
import { LIB_NAME } from 'configs/subApp';

export const lib = exposeLib<LibProperties>(LIB_NAME);
export type Lib = LibProperties;

export default lib;
```

## 高级用法

### 使用方直接获得代理对象

虽然`exposeLib`是服务于模块提供方的接口,但如果模块提供方并未发布代理对象到 npm,而使用方有需要使用静态导入功能时,可使用`exposeLib`直接获取到代理对象

```ts
// 入口文件出预加载运行时代码
await preFetchLib('xxx');

// 其他文件里使用 exposeLib 获得模块代理对象
import { exposeLib } from 'hel-lib-proxy';
const xxxLib = exposeLib('xxx');
xxx.callRemoteMethod(); // 这里即可安全的调用远程方法
```

也可透传类型泛型获得相关类型提示

```ts
const xxxLib = exposeLib<LibType>('xxx');
```
36 changes: 36 additions & 0 deletions doc/docs/api/action/get-lib.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
---
sidebar_position: 2
---

# getLib

`getLib`是服务于模块使用方的接口,提前调用[preFetchLib](/docs/api/hel-micro/prefetch-lib)做预加载后,可直接获取远程模块暴露对象

## 基础用法

### 获取模块对象

获取第一个预加载的模块对象

```ts
import { getLib } from 'hel-lib-proxy';
getLib('xxx');
```

### 指定版本号

获取指定版本的模块对象

```ts
import { getLib } from 'hel-lib-proxy';
getLib('xxx', { versionId: 'v1' });
```

### 指定平台值

获取指定平台值的模块对象(默认值 unpkg)

```ts
import { getLib } from 'hel-lib-proxy';
getLib('xxx', { platform: 'myplat' });
```
Loading

0 comments on commit 526dc31

Please sign in to comment.