chore: adjust webpack output (#11573)

- automatically split i18n resources into i18n-langs.{lang} naming
- force worker resources to be bundled in one file

tools/cli/src/webpack/cache-group.ts

@@ -5,6 +5,19 @@ function testPackageName(regexp: RegExp): (module: any) => boolean {
 
 // https://hackernoon.com/the-100-correct-way-to-split-your-chunks-with-webpack-f8a9df5b7758
 export const productionCacheGroups = {
+  i18n: {
+    test: /frontend[\\/]i18n[\\/]/,
+    name: (module: any) => {
+      const name = module.resource.match(/[\\/]([^\\/]+)\.json$/)?.[1];
+      if (name && name !== 'en') {
+        return `i18n-langs.${name}`;
+      }
+
+      return 'i18n';
+    },
+    priority: 200,
+    enforce: true,
+  },
   asyncVendor: {
     test: /[\\/]node_modules[\\/]/,
     name(module: any) {

tools/cli/src/webpack/index.ts

@@ -414,7 +414,7 @@ export function createWorkerTargetConfig(
 
   return {
     name: entry,
-    context: pkg.path.value,
+    context: ProjectRoot.value,
     experiments: {
       topLevelAwait: true,
       outputModule: false,
@@ -541,6 +541,9 @@ export function createWorkerTargetConfig(
           {} as Record<string, string>
         )
       ),
+      new webpack.optimize.LimitChunkCountPlugin({
+        maxChunks: 1,
+      }),
       process.env.SENTRY_AUTH_TOKEN &&
         process.env.SENTRY_ORG &&
         process.env.SENTRY_PROJECT &&