fix(expo): remove deprecated webpack. (#26137)

config.js

<!-- Please make sure you have read the submission guidelines before
posting an PR -->
<!--
https://github.com/nrwl/nx/blob/master/CONTRIBUTING.md#-submitting-a-pr
-->

<!-- Please make sure that your commit message follows our format -->
<!-- Example: `fix(nx): must begin with lowercase` -->

## Current Behavior
<!-- This is the behavior we have today -->

## Expected Behavior
<!-- This is the behavior we should expect with the changes in this PR
-->

## Related Issue(s)
<!-- Please link the issue being fixed so it gets closed when this is
merged. -->

Fixes https://github.com/nrwl/nx/issues/26118
https://github.com/nrwl/nx/issues/25291
https://github.com/nrwl/nx/issues/23233

packages/expo/migrations.json

@@ -71,6 +71,12 @@
       "cli": "nx",
       "description": "Change webpack to metro in expo projects",
       "factory": "./src/migrations/update-19-0-0/change-webpack-to-metro"
+    },
+    "update-19-2-0-remove-webpack-config": {
+      "version": "19.2.0-beta.2",
+      "cli": "nx",
+      "description": "Remove deprecated webpack.config.js",
+      "factory": "./src/migrations/update-19-2-0/remove-deprecated-webpack-config"
     }
   },
   "packageJsonUpdates": {

packages/expo/src/generators/application/files/webpack.config.js.template

@@ -1,57 +0,0 @@
-const createExpoWebpackConfigAsync = require('@expo/webpack-config');
-const { TsconfigPathsPlugin } = require('tsconfig-paths-webpack-plugin');
-const { resolve } = require('path');
-
-/**
- * @deprecated use bundler: 'metro' instead
- */
-module.exports = async function (env, argv) {
-  const config = await createExpoWebpackConfigAsync(env, argv);
-
-  // Customize the config before returning it.
-  // add additional rule to load files under libs
-  const rules = config.module.rules.find((rule) =>
-    Array.isArray(rule.oneOf)
-  )?.oneOf;
-  if (rules) {
-    rules.push({
-      test: /\.(mjs|[jt]sx?)$/,
-      exclude: /node_modules/,
-      use: {
-        loader: require.resolve('@nx/webpack/src/utils/web-babel-loader.js'),
-        options: {
-          presets: [
-            [
-              '@nx/react/babel',
-              {
-                runtime: 'automatic',
-              },
-            ],
-          ],
-        },
-      },
-    });
-  }
-
-  if (!config.resolve) {
-    config.resolve = {};
-  }
-  if (!config.resolve.plugins) {
-    config.resolve.plugins = [];
-  }
-  const extensions = ['.ts', '.tsx', '.mjs', '.js', '.jsx'];
-  const tsConfigPath = resolve(__dirname, 'tsconfig.json');
-  config.resolve.plugins.push(
-    new TsconfigPathsPlugin({
-      configFile: tsConfigPath,
-      extensions,
-    })
-  );
-  config.resolve.fallback = {
-    ...config.resolve.fallback,
-    crypto: require.resolve('crypto-browserify'),
-    stream: require.resolve('stream-browserify'),
-  };
-
-  return config;
-};

packages/expo/src/migrations/update-19-0-0/change-webpack-to-metro.ts

@@ -23,12 +23,14 @@ export default async function update(tree: Tree) {
         config.targets['export-web'].options.bundler = 'metro';
       }
 
-      updateJson(tree, `${config.root}/app.json`, (appJson) => {
+      if (tree.exists(`${config.root}/app.json`)) {
-        if (appJson.expo?.web) {
+        updateJson(tree, `${config.root}/app.json`, (appJson) => {
-          appJson.expo.web.bundler = 'metro';
+          if (appJson.expo?.web) {
-        }
+            appJson.expo.web.bundler = 'metro';
-        return appJson;
+          }
-      });
+          return appJson;
+        });
+      }
     }
 
     updateProjectConfiguration(tree, name, config);

packages/expo/src/migrations/update-19-2-0/remove-deprecated-webpack-config.spec.ts

@@ -0,0 +1,30 @@
+import { addProjectConfiguration, Tree } from '@nx/devkit';
+import { createTreeWithEmptyWorkspace } from '@nx/devkit/testing';
+import update from './remove-deprecated-webpack-config';
+
+describe('remove-deprecated-webpack-config', () => {
+  let tree: Tree;
+
+  beforeEach(async () => {
+    tree = createTreeWithEmptyWorkspace({ layout: 'apps-libs' });
+    addProjectConfiguration(tree, 'product', {
+      root: 'apps/product',
+      sourceRoot: 'apps/product/src',
+      targets: {
+        start: {
+          executor: '@nx/expo:start',
+        },
+      },
+    });
+    tree.write(
+      `apps/product/webpack.config.js`,
+      'module.exports = { /* webpack config */ };'
+    );
+  });
+
+  it(`should remove webpack.config.js`, async () => {
+    await update(tree);
+
+    expect(tree.exists('apps/product/webpack.config.js')).toBe(false);
+  });
+});

packages/expo/src/migrations/update-19-2-0/remove-deprecated-webpack-config.ts

@@ -0,0 +1,19 @@
+import { Tree, getProjects } from '@nx/devkit';
+import { removeSync } from 'fs-extra';
+import { join } from 'path';
+
+/**
+ * This function removes the deprecated webpack.config.js file from projects that use the expo:start executor
+ * @param tree
+ */
+export default async function update(tree: Tree) {
+  const projects = getProjects(tree);
+
+  for (const [_, config] of projects.entries()) {
+    if (config.targets?.['start']?.executor === '@nx/expo:start') {
+      if (tree.exists(join(config.root, 'webpack.config.js'))) {
+        tree.delete(join(config.root, 'webpack.config.js'));
+      }
+    }
+  }
+}