Skip to content

Commit

Permalink
docs(builder): add assetsRetry notes (#4007)
Browse files Browse the repository at this point in the history
  • Loading branch information
chenjiahan committed Jun 19, 2023
1 parent 55fc376 commit 92ad5b6
Show file tree
Hide file tree
Showing 2 changed files with 56 additions and 0 deletions.
28 changes: 28 additions & 0 deletions packages/document/builder-doc/docs/en/config/output/assetsRetry.md
Original file line number Diff line number Diff line change
Expand Up @@ -227,3 +227,31 @@ export default {
After adding the above configuration, the runtime code of `assetsRetry` will be extracted into a separate `assets-retry.[version].js` file and output to the dist directory.

The downside is that `assets-retry.[version].js` itself may fail to load. If this happens, the assets retry will not work. Therefore, we prefer to inline the runtime code into the HTML file.

### Notes

When you use `assetsRetry`, the Builder injects some runtime code into the HTML and serializes the `assetsRetry` config, inserting it into the runtime code. Therefore, you need to be aware of the following:

- Avoid configuring sensitive information in `assetsRetry`, such as internal tokens.
- Avoid referencing variables or methods outside of `onRetry`, `onSuccess`, and `onFail`.
- Avoid using syntax with compatibility issues in `onRetry`, `onSuccess` and `onFail` as these functions are inlined directly into the HTML.

Here's an example of incorrect usage:

```js
import { someMethod } from 'utils';

export default {
output: {
assetsRetry: {
onRetry() {
// Incorrect usage, includes sensitive information
const privateToken = 'a-private-token';

// Incorrect usage, uses an external method
someMethod(privateToken);
},
},
},
};
```
28 changes: 28 additions & 0 deletions packages/document/builder-doc/docs/zh/config/output/assetsRetry.md
Original file line number Diff line number Diff line change
Expand Up @@ -227,3 +227,31 @@ export default {
添加以上配置后,`assetsRetry` 的运行时代码会被抽取为一个独立的 `assets-retry.[version].js` 文件,并输出到产物目录下。

这种方式的弊端在于,`assets-retry.[version].js` 自身有加载失败的可能性。如果出现这种情况,静态资源重试的逻辑就无法生效。因此,我们更推荐将运行时代码内联到 HTML 文件中。

### 注意事项

当你使用 `assetsRetry` 时,Builder 会向 HTML 中注入一段运行时代码,并将 `assetsRetry` 配置的内容序列化,插入到这段代码中,因此你需要注意:

- 避免在 `assetsRetry` 中配置敏感信息,比如内部使用的 token。
- 避免在 `onRetry``onSuccess``onFail` 中引用函数外部的变量或方法。
- 避免在 `onRetry``onSuccess``onFail` 中使用有兼容性问题的语法,因为这些函数会被直接内联到 HTML 中。

以下是一个错误示例:

```js
import { someMethod } from 'utils';

export default {
output: {
assetsRetry: {
onRetry() {
// 错误用法,包含了敏感信息
const privateToken = 'a-private-token';

// 错误用法,使用了外部的方法
someMethod(privateToken);
},
},
},
};
```

0 comments on commit 92ad5b6

Please sign in to comment.