https://rsbuild.rs/static/js/async/route-b57197dbb89b.39ac02f163.js

1"use strict";(self.rspackChunkrsbuild_website=self.rspackChunkrsbuild_website||[]).push([["2x"],{OG(e,s,r){r.r(s);var l=r("E"),n=r("HC"),i=r("x");function o(e){let s={a:"a",blockquote:"blockquote",code:"code",h1:"h1",h2:"h2",h3:"h3",li:"li",p:"p",pre:"pre",span:"span",strong:"strong",table:"table",tbody:"tbody",td:"td",th:"th",thead:"thead",tr:"tr",ul:"ul",...(0,n.R)(),...e.components};return(0,l.jsxs)(l.Fragment,{children:[(0,l.jsxs)(s.h1,{id:"outputpolyfill",children:[(0,l.jsx)(s.a,{className:"rp-header-anchor","aria-hidden":"true",href:"#outputpolyfill",children:"#"}),"output.polyfill"]}),"\n",(0,l.jsxs)(s.ul,{children:["\n",(0,l.jsxs)(s.li,{children:[(0,l.jsx)(s.strong,{children:"Type:"})," ",(0,l.jsx)(s.code,{children:"'entry' | 'usage' | 'off'"})]}),"\n",(0,l.jsxs)(s.li,{children:[(0,l.jsx)(s.strong,{children:"Default:"})," ",(0,l.jsx)(s.code,{children:"'off'"})]}),"\n"]}),"\n",(0,l.jsx)(s.p,{children:"Controls the polyfill injection mode."}),"\n",(0,l.jsxs)(s.blockquote,{children:["\n",(0,l.jsxs)(s.p,{children:["See ",(0,l.jsx)(s.a,{href:"/guide/advanced/browser-compatibility.html#polyfills",children:"Polyfill Mode"})," for more details."]}),"\n"]}),"\n",(0,l.jsxs)(s.h2,{id:"install-core-js",children:[(0,l.jsx)(s.a,{className:"rp-header-anchor","aria-hidden":"true",href:"#install-core-js",children:"#"}

1),"Install core-js"]}),"\n",(0,l.jsxs)(s.p,{children:["When you enable polyfill injection, make sure ",(0,l.jsx)(s.a,{href:"https://github.com/zloirock/core-js",rel:"noopener noreferrer",target:"_blank",children:"core-js"})," v3 is installed in your project, which is a popular polyfill library for JavaScript."]}),"\n","\n",(0,l.jsx)(i.ky,{command:"add core-js"}),"\n",(0,l.jsxs)(s.h2,{id:"optional-value",children:[(0,l.jsx)(s.a,{className:"rp-header-anchor","aria-hidden":"true",href:"#optional-value",children:"#"}),"Optional value"]}),"\n",(0,l.jsxs)(s.h3,{id:"usage",children:[(0,l.jsx)(s.a,{className:"rp-header-anchor","aria-hidden":"true",href:"#usage",children:"#"}),"usage"]}),"\n",(0,l.jsxs)(s.p,{children:["With ",(0,l.jsx)(s.code,{children:"output.polyfill"})," set to ",(0,l.jsx)(s.code,{children:"'usage'"}),", Rsbuild injects polyfills based on the APIs used in each file. This provides optimal bundle size by including only needed polyfills."]}),"\n",(0,l.jsx)(l.Fragment,{children:(0,l.jsx)(s.pre,{className:"shiki css-variables",style:{backgroundColor:"var(--shiki-background)",color:"var(--shiki-foreground)"},tabIndex:"0",title:"rsbuild.config.ts",lang:"ts",children:(0,l.jsxs)(s.code,{children:[(0,l.jsxs)(s.span,{className:"line",children:[(0,l.jsx)(s.span,{style:{color:"var(--shiki-token-keyword)"},children:"export"}),(0,l.jsx)(s.span,{style:{color:"var(--shiki-token-keyword)"},children:" default"}),(0,l.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:" {"})]}),"\n",(0,l.jsxs)(s.span,{className:"line",children:[(0,l.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:"  output"}),(0,l.jsx)(s.span,{style:{color:"var(--shiki-token-keyword)"},children:":"}),(0,l.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:" {"})]}),"\n",(0,l.jsxs)(s.span,{className:"line",children:[(0,l.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:"    polyfill"}),(0,l.jsx)(s.span,{style:{color:"var(--shiki-token-keyword)"},children:":"}),(0,l.jsx)(s.span,{style:{color:"var(--shiki-token-string-expression)"},children:" 'usage'"}),(0,l.jsx)(s.span,{style:{color:"var(--shiki-token-punctuation)"},children:","})]}),"\n",(0,l.jsxs)(s.span,{className:"line",children:[(0,l.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:"  }"}),(0,l.jsx)(s.span,{style:{color:"var(--shiki-token-punctuation)"},children:","})]}),"\n",(0,l.jsx)(s.span,{className:"line",children:(0,l.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:"};"})})]})})}),"\n",(0,l.jsxs)(s.h3,{id:"entry",children:[(0,l.jsx)(s.a,{className:"rp-header-anchor","aria-hidden":"true",href:"#entry",children:"#"}),"entry"]}),"\n",(0,l.jsxs)(s.p,{children:["With ",(0,l.jsx)(s.code,{children:"output.polyfill"})," set to ",(0,l.jsx)(s.code,{children:"'entry'"}),", Rsbuild injects polyfills in each entry file. This ensures all polyfills are available but may increase bundle size."]}),"\n",(0,l.jsx)(l.Fragment,{children:(0,l.jsx)(s.pre,{className:"shiki css-variables",style:{backgroundColor:"var(--shiki-background)",color:"var(--shiki-foreground)"},tabIndex:"0",title:"rsbuild.config.ts",lang:"ts",children:(0,l.jsxs)(s.code,{children:[(0,l.jsxs)(s.span,{className:"line",children:[(0,l.jsx)(s.span,{style:{color:"var(--shiki-token-keyword)"},children:"export"}),(0,l.jsx)(s.span,{style:{color:"var(--shiki-token-keyword)"},children:" default"}),(0,l.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:" {"})]}),"\n",(0,l.jsxs)(s.span,{className:"line",children:[(0,l.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:"  output"}),(0,l.jsx)(s.span,{style:{color:"var(--shiki-token-keyword)"},children:":"}),(0,l.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:" {"})]}),"\n",(0,l.jsxs)(s.span,{className:"line",children:[(0,l.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:"    polyfill"}),(0,l.jsx)(s.span,{style:{color:"var(--shiki-token-keyword)"},children:":"}),(0,l.jsx)(s.span,{style:{color:"var(--shiki-token-string-expression)"},children:" 'entry'"}),(0,l.jsx)(s.span,{style:{color:"var(--shiki-token-punctuation)"},children:","})]}),"\n",(0,l.jsxs)(s.span,{className:"line",children:[(0,l.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:"  }"}),(0,l.jsx)(s.span,{style:{color:"var(--shiki-token-punctuation)"},children:","})]}),"\n",(0,l.jsx)(s.span,{className:"line",children:(0,l.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:"};"})})]})})}),"\n",(0,l.jsx)(i.Pq,{type:"tip",title:"Tip",children:(0,l.jsxs)(s.p,{children:["\nIt should be noted that when you bundle page with ",(0,l.jsx)(s.a,{href:"/guide/basic/web-workers.html",children:"Web Workers"}),", the ",(0,l.jsx)(s.code,{children:"entry"})," mode is not applicable to Web Workers because the Web Workers thread is isolated from the main thread (page), and the ",(0,l.jsx)(s.code,{children:"usage"})," mode can be used at this time."]})}),"\n",(0,l.jsxs)(s.h3,{id:"off",children:[(0,l.jsx)(s.a,{className:"rp-header-anchor","aria-hidden":"true",href:"#off",children:"#"}),"off"]}),"\n",(0,l.jsxs)(s.p,{children:["With ",(0,l.jsx)(s.code,{children:"output.polyfill"})," set to ",(0,l.jsx)(s.code,{children:"'off'"}),", Rsbuild doesn't inject polyfills. You need to handle code compatibility yourself."]}

1),"\n",(0,l.jsx)(l.Fragment,{children:(0,l.jsx)(s.pre,{className:"shiki css-variables",style:{backgroundColor:"var(--shiki-background)",color:"var(--shiki-foreground)"},tabIndex:"0",title:"rsbuild.config.ts",lang:"ts",children:(0,l.jsxs)(s.code,{children:[(0,l.jsxs)(s.span,{className:"line",children:[(0,l.jsx)(s.span,{style:{color:"var(--shiki-token-keyword)"},children:"export"}),(0,l.jsx)(s.span,{style:{color:"var(--shiki-token-keyword)"},children:" default"}),(0,l.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:" {"})]}),"\n",(0,l.jsxs)(s.span,{className:"line",children:[(0,l.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:"  output"}),(0,l.jsx)(s.span,{style:{color:"var(--shiki-token-keyword)"},children:":"}),(0,l.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:" {"})]}),"\n",(0,l.jsxs)(s.span,{className:"line",children:[(0,l.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:"    polyfill"}),(0,l.jsx)(s.span,{style:{color:"var(--shiki-token-keyword)"},children:":"}),(0,l.jsx)(s.span,{style:{color:"var(--shiki-token-string-expression)"},children:" 'off'"}),(0,l.jsx)(s.span,{style:{color:"var(--shiki-token-punctuation)"},children:","})]}),"\n",(0,l.jsxs)(s.span,{className:"line",children:[(0,l.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:"  }"}),(0,l.jsx)(s.span,{style:{color:"var(--shiki-token-punctuation)"},children:","})]}),"\n",(0,l.jsx)(s.span,{className:"line",children:(0,l.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:"};"})})]})})}),"\n",(0,l.jsxs)(s.h2,{id:"version-history",children:[(0,l.jsx)(s.a,{className:"rp-header-anchor","aria-hidden":"true",href:"#version-history",children:"#"}),"Version history"]}),"\n",(0,l.jsxs)(s.table,{children:[(0,l.jsx)(s.thead,{children:(0,l.jsxs)(s.tr,{children:[(0,l.jsx)(s.th,{children:"Version"}),(0,l.jsx)(s.th,{children:"Changes"})]})}),(0,l.jsx)(s.tbody,{children:(0,l.jsxs)(s.tr,{children:[(0,l.jsx)(s.td,{children:"v2.0.0"}),(0,l.jsxs)(s.td,{children:["Rsbuild no longer depends on ",(0,l.jsx)(s.code,{children:"core-js"})," by default"]})]})})]})]})}function a(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},{wrapper:s}={...(0,n.R)(),...e.components};return s?(0,l.jsx)(s,{...e,children:(0,l.jsx)(o,{...e})}):o(e)}a.__RSPRESS_PAGE_META={},a.__RSPRESS_PAGE_META["en%2Fconfig%2Foutput%2Fpolyfill.mdx"]={toc:[{id:"install-core-js",text:"Install core-js",depth:2},{id:"optional-value",text:"Optional value",depth:2},{id:"usage",text:"usage",depth:3},{id:"entry",text:"entry",depth:3},{id:"off",text:"off",depth:3},{id:"version-history",text:"Version history",depth:2}],title:"output.polyfill",headingTitle:"output.polyfill",frontmatter:{description:"When you enable polyfill injection, make sure core-js v3 is installed in your project, which is a popular polyfill library for JavaScript."}},r.d(s,{default:()=>a})}}]);