Improve chunks for locales

.gitlab-ci.yml

@@ -188,9 +188,9 @@ Build:
     - find . -name '*.js' | cpio -pdm ../source-maps/
     - cd ..
     # Cleanup source maps for unimportant bundles
+    - rm -f source-maps/runtime.js
+    - rm -f source-maps/intl-polyfills.js
     - rm -rf source-maps/locale-*
-    - rm -rf source-maps/intl*
-    - rm -rf source-maps/vendors~*
   artifacts:
     name: "Production build for $CI_COMMIT_BRANCH-$CI_COMMIT_SHORT_SHA"
     paths:

webpack.config.js

@@ -211,11 +211,7 @@ const webpackConfig = {
 };
 
 if (isAnalyze) {
-    webpackConfig.plugins.push(
-        new BundleAnalyzerPlugin({
-            excludeAssets: /^(vendors~intl|locale-|intl)/,
-        }),
-    );
+    webpackConfig.plugins.push(new BundleAnalyzerPlugin());
 }
 
 if (isProduction) {
@@ -250,14 +246,39 @@ if (isProduction) {
         splitChunks: {
             cacheGroups: {
                 vendor: {
-                    test: (m) =>
-                        String(m.context).includes('node_modules') &&
-                        // icons and intl with relateed polyfills are allowed
-                        // to be splitted to other chunks
-                        !/\/(flag-icon-css|intl|@formatjs)\//.test(String(m.context)),
                     name: 'vendors',
+                    priority: 0,
+                    test: (m) => String(m.context).includes('node_modules'),
                     chunks: 'all',
                 },
+                polyfills: {
+                    name: 'intl-polyfills',
+                    priority: 1,
+                    chunks: ({ name }) => ['intl', 'intl-pluralrules', 'intl-relativetimeformat'].includes(name),
+                    enforce: true,
+                },
+                ...SUPPORTED_LANGUAGES.reduce((acc, locale) => {
+                    const localePolyfills = [
+                        `intl-${locale}-js`,
+                        `intl-pluralrules-${locale}-js`,
+                        `intl-relativetimeformat-${locale}-js`,
+                    ];
+
+                    acc[locale] = {
+                        name: `locale-${locale}`,
+                        priority: 1,
+                        chunks: ({ name }) => name === `locale-${locale}-json`,
+                        enforce: true,
+                    };
+                    acc[`${locale}Polyfill`] = {
+                        name: `locale-${locale}-polyfill`,
+                        priority: 2,
+                        chunks: ({ name }) => localePolyfills.includes(name),
+                        enforce: true,
+                    };
+
+                    return acc;
+                }, {}),
             },
         },
     };