Webpack generate polyfills-core-js.js and polyfills-dom.js files after use @ionic/react

Ionic Framework Ionic React
1

I’m using create-react-app --typescript and ionic/react, but once i import IonApp, the build folder add four files after my packaged. I’m not sure whether it related ionic or not, because i cant find any infomation on the internet. Can i delete these files or combine polyfills-dom.js into polyfills-core-js? any suggestions is helpful.here is the screenshop

image
image1920×1310 150 KB

2

Using create-react-app v5 and Ionic v6, I don’t have any polyfills after building.

What are your settings in tsconfig.json?

For example, this is what I have:

{
  "compilerOptions": {
    "target": "es2017",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": false,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react-jsx",
    "noFallthroughCasesInSwitch": true
  },
  "include": [
    "src",
    "tests/playwright/*",
    "tests/playwright/pom",
  ]
}
3

Thanks for ur reply, this is my tsconfig settings, it seems nothing different.

{
  "compilerOptions": {
    "target": "es5",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "noFallthroughCasesInSwitch": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react-jsx"
  },
  "include": [
    "src"
  ]
}

Bye the way, i changed maxChunks to 3 in webpack.config.js plugins, Im using create-react-app v5 and ionic/react v5.9, their name are polyfills-core-js and polyfills-dom after packaged. When i use Ionic/cli, their name become normal chunks, but they have same contents. Maybe u can find them wihch build files end with js.LICENSE.txt

new webpack.optimize.LimitChunkCountPlugin({
     maxChunks: 3, 
     minChunkSize: 1000
}),

image
image1920×963 120 KB

4

Ah, I see. Upon closer inspection, I have the same polyfills.

This is outside my expertise, but if I had to guess, they might be pulled in by Ionic due to the Stencil dependency, since Stencil makes extensive use of shadow DOM.

Hopefully someone who knows more can chime in and explain this.

5

Thank u all the same.Have a good day ~