chore(repo): bump webpack version (#17836)

package.json

@@ -267,7 +267,7 @@
     "use-sync-external-store": "^1.2.0",
     "verdaccio": "^5.0.4",
     "vite": "^4.3.4",
-    "webpack": "5.86.0",
+    "webpack": "5.88.0",
     "webpack-dev-server": "^4.9.3",
     "webpack-merge": "^5.8.0",
     "webpack-node-externals": "^3.0.0",

packages/angular/src/builders/webpack-browser/webpack-browser.impl.ts

@@ -109,6 +109,7 @@ export function executeWebpackBrowserBuilder(
               );
 
               baseWebpackConfig.plugins.push(
+                // @ts-expect-error - difference between angular and webpack plugin definitions bc of webpack versions
                 new WebpackNxBuildCoordinationPlugin(
                   `nx run-many --target=${
                     context.target.target

packages/angular/src/builders/webpack-dev-server/webpack-dev-server.impl.ts

@@ -129,6 +129,7 @@ export function executeWebpackDevServerBuilder(
             // This will occur when workspaceDependencies = []
             if (workspaceDependencies.length > 0) {
               baseWebpackConfig.plugins.push(
+                // @ts-expect-error - difference between angular and webpack plugin definitions bc of webpack versions
                 new WebpackNxBuildCoordinationPlugin(
                   `nx run-many --target=${
                     parsedBrowserTarget.target

packages/react/plugins/storybook/index.ts

@@ -135,7 +135,7 @@ const fixBabelConfigurationIfNeeded = (
   let babelRuleItem;
   for (const rule of webpackConfig.module.rules) {
     if (typeof rule === 'string') continue;
-    if (!Array.isArray(rule.use)) continue;
+    if (!rule || !Array.isArray(rule.use)) continue;
     for (const item of rule.use) {
       if (typeof item !== 'string' && item['loader'].includes('babel-loader')) {
         babelRuleItem = item;
@@ -229,8 +229,8 @@ export const webpack = async (
       new DefinePlugin(
         getClientEnvironment(storybookWebpackConfig.mode).stringified
       ),
-      ...(storybookWebpackConfig.plugins ?? []),
+      ...((storybookWebpackConfig.plugins as WebpackPluginInstance[]) ?? []),
-      ...(finalConfig.plugins ?? [])
+      ...((finalConfig.plugins as WebpackPluginInstance[]) ?? [])
     ) as WebpackPluginInstance[],
   };
 };

packages/react/plugins/with-react.ts

@@ -13,6 +13,7 @@ function addHotReload(config: Configuration) {
     // add `react-refresh/babel` to babel loader plugin
     const babelLoader = config.module.rules.find(
       (rule) =>
+        rule &&
         typeof rule !== 'string' &&
         rule.loader?.toString().includes('babel-loader')
     );