docs: add UA polyfill guide (#3115)

web-infra-dev · Aug 2, 2024 · cb93ff5 · cb93ff5
1 parent fd9a0ae
commit cb93ff5
Show file tree

Hide file tree

Showing 2 changed files with 46 additions and 0 deletions.
diff --git a/website/docs/en/guide/advanced/browser-compatibility.mdx b/website/docs/en/guide/advanced/browser-compatibility.mdx
@@ -241,3 +241,26 @@ export default {
   },
 };
 ```
+
+### UA Polyfill
+
+Cloudflare provides a [polyfill service](https://cdnjs.cloudflare.com/polyfill/) that can automatically generate polyfill bundle based on the user's browser User-Agent.
+
+You can use the [html.tags](/config/html/tags) config of Rsbuild to inject scripts. For example, injecting a `<script>` tag at the beginning of the `<head>` tag:
+
+```ts
+export default {
+  html: {
+    tags: [
+      {
+        tag: 'script',
+        attrs: {
+          defer: true,
+          src: 'https://cdnjs.cloudflare.com/polyfill/v3/polyfill.min.js?features=default',
+        },
+        append: false,
+      },
+    ],
+  },
+};
+```
diff --git a/website/docs/zh/guide/advanced/browser-compatibility.mdx b/website/docs/zh/guide/advanced/browser-compatibility.mdx
@@ -241,3 +241,26 @@ export default {
   },
 };
 ```
+
+### UA Polyfill
+
+Cloudflare 提供了一个 [polyfill 服务](https://cdnjs.cloudflare.com/polyfill/)，可以根据用户浏览器的 User-Agent 自动生成 polyfill 文件。
+
+你可以通过 Rsbuild 的 [html.tags](/config/html/tags) 配置来注入脚本，例如在 `<head>` 标签的开头插入 `<script>` 标签：
+
+```ts
+export default {
+  html: {
+    tags: [
+      {
+        tag: 'script',
+        attrs: {
+          defer: true,
+          src: 'https://cdnjs.cloudflare.com/polyfill/v3/polyfill.min.js?features=default',
+        },
+        append: false,
+      },
+    ],
+  },
+};
+```