From 2cb7ecb77b33e606b6a976c102ec4dc6adb80443 Mon Sep 17 00:00:00 2001 From: Emily Xiong Date: Thu, 30 May 2024 22:49:46 -0400 Subject: [PATCH] fix(expo): remove deprecated webpack. (#26137) config.js ## Current Behavior ## Expected Behavior ## Related Issue(s) 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 | 6 ++ .../files/webpack.config.js.template | 57 ------------------- .../update-19-0-0/change-webpack-to-metro.ts | 14 +++-- .../remove-deprecated-webpack-config.spec.ts | 30 ++++++++++ .../remove-deprecated-webpack-config.ts | 19 +++++++ 5 files changed, 63 insertions(+), 63 deletions(-) delete mode 100644 packages/expo/src/generators/application/files/webpack.config.js.template create mode 100644 packages/expo/src/migrations/update-19-2-0/remove-deprecated-webpack-config.spec.ts create mode 100644 packages/expo/src/migrations/update-19-2-0/remove-deprecated-webpack-config.ts diff --git a/packages/expo/migrations.json b/packages/expo/migrations.json index 9109062c3b..87c8fe7332 100644 --- a/packages/expo/migrations.json +++ b/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": { diff --git a/packages/expo/src/generators/application/files/webpack.config.js.template b/packages/expo/src/generators/application/files/webpack.config.js.template deleted file mode 100644 index 7772ece5f9..0000000000 --- a/packages/expo/src/generators/application/files/webpack.config.js.template +++ /dev/null @@ -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; -}; diff --git a/packages/expo/src/migrations/update-19-0-0/change-webpack-to-metro.ts b/packages/expo/src/migrations/update-19-0-0/change-webpack-to-metro.ts index 86c176d12c..3942b7d5e5 100644 --- a/packages/expo/src/migrations/update-19-0-0/change-webpack-to-metro.ts +++ b/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 (appJson.expo?.web) { - appJson.expo.web.bundler = 'metro'; - } - return appJson; - }); + if (tree.exists(`${config.root}/app.json`)) { + updateJson(tree, `${config.root}/app.json`, (appJson) => { + if (appJson.expo?.web) { + appJson.expo.web.bundler = 'metro'; + } + return appJson; + }); + } } updateProjectConfiguration(tree, name, config); diff --git a/packages/expo/src/migrations/update-19-2-0/remove-deprecated-webpack-config.spec.ts b/packages/expo/src/migrations/update-19-2-0/remove-deprecated-webpack-config.spec.ts new file mode 100644 index 0000000000..46a3e3dcd7 --- /dev/null +++ b/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); + }); +}); diff --git a/packages/expo/src/migrations/update-19-2-0/remove-deprecated-webpack-config.ts b/packages/expo/src/migrations/update-19-2-0/remove-deprecated-webpack-config.ts new file mode 100644 index 0000000000..939fb5327b --- /dev/null +++ b/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')); + } + } + } +}