From 98a717f0b6e5ea43bd07fbde60cd886760f2f02e Mon Sep 17 00:00:00 2001 From: Mark Lawlor Date: Wed, 3 Sep 2025 14:35:14 +1000 Subject: [PATCH] fix: remove transient dependency on connect --- example/package.json | 3 +- package.json | 5 +- src/metro/index.ts | 23 +++--- yarn.lock | 186 +------------------------------------------ 4 files changed, 19 insertions(+), 198 deletions(-) diff --git a/example/package.json b/example/package.json index ec3a2277..831b685b 100644 --- a/example/package.json +++ b/example/package.json @@ -11,6 +11,7 @@ "web": "expo start --web" }, "dependencies": { + "@expo/metro-runtime": "~6.1.1", "@tailwindcss/postcss": "^4.1.11", "expo": "54.0.0-preview.13", "expo-dev-client": "6.0.4", @@ -18,7 +19,7 @@ "expo-system-ui": "6.0.6", "react": "19.1.0", "react-dom": "19.1.0", - "react-native": "0.81.0", + "react-native": "0.81.1", "react-native-reanimated": "4.0.2", "react-native-web": "~0.21.1", "react-native-worklets": "0.4.1", diff --git a/package.json b/package.json index 46a184bb..a7b6d477 100644 --- a/package.json +++ b/package.json @@ -161,23 +161,20 @@ "expo": "54.0.0-preview.13", "lightningcss": ">=1.27.0", "react": "19.1.0", - "react-native": "0.81.0" + "react-native": "0.81.1" }, "devDependencies": { "@babel/core": "^7.28.0", "@commitlint/config-conventional": "^19.8.1", "@eslint/js": "^9.30.1", - "@expo/metro-runtime": "~6.1.1", "@ianvs/prettier-plugin-sort-imports": "^4.4.2", "@tailwindcss/postcss": "^4.1.12", "@testing-library/react-native": "^13.3.3", "@tsconfig/react-native": "^3.0.6", "@types/babel__core": "^7", - "@types/connect": "^3.4.38", "@types/debug": "^4.1.12", "@types/jest": "^30.0.0", "@types/react": "^19.1.10", - "@types/react-refresh": "^0", "@types/react-test-renderer": "^19", "babel-plugin-tester": "^12.0.0", "babel-preset-expo": "~14.0.6", diff --git a/src/metro/index.ts b/src/metro/index.ts index dfbed7f3..47ca6966 100644 --- a/src/metro/index.ts +++ b/src/metro/index.ts @@ -2,7 +2,6 @@ import { dirname, relative, sep } from "node:path"; import { versions } from "node:process"; -import connect from "connect"; import debug from "debug"; import type { MetroConfig } from "metro-config"; @@ -50,9 +49,6 @@ export function withReactNativeCSS< setupTypeScript(typescriptEnvPath); } - const originalMiddleware = config.server?.enhanceMiddleware; - const originalResolver = config.resolver?.resolveRequest; - return { ...config, transformerPath: require.resolve("./metro-transformer"), @@ -68,13 +64,14 @@ export function withReactNativeCSS< return { type: "empty" }; } + const parentResolver = + config.resolver?.resolveRequest ?? context.resolveRequest; + // Don't hijack the resolution of react-native imports if (!globalClassNamePolyfill) { - const parentResolver = originalResolver ?? context.resolveRequest; return parentResolver(context, moduleName, platform); } - const parentResolver = originalResolver ?? context.resolveRequest; const resolver = platform === "web" ? webResolver : nativeResolver; const resolved = resolver( parentResolver, @@ -88,8 +85,7 @@ export function withReactNativeCSS< }, server: { ...config.server, - enhanceMiddleware(middleware, metroServer) { - const server = connect(); + enhanceMiddleware(metroMiddleware, metroServer) { const bundler: any = metroServer.getBundler().getBundler(); if (!bundler.__react_native_css__patched) { @@ -230,9 +226,14 @@ export function withReactNativeCSS< }; } - return originalMiddleware - ? server.use(originalMiddleware(middleware, metroServer)) - : server.use(middleware); + /** + * We don't modify the middleware, we just use this function to get the metroServer + * So simply return the existing middleware + */ + return ( + config.server?.enhanceMiddleware?.(metroMiddleware, metroServer) ?? + metroMiddleware + ); }, }, }; diff --git a/yarn.lock b/yarn.lock index 00a5cfdb..a9883d37 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3537,13 +3537,6 @@ __metadata: languageName: node linkType: hard -"@react-native/assets-registry@npm:0.81.0": - version: 0.81.0 - resolution: "@react-native/assets-registry@npm:0.81.0" - checksum: 10c0/d3693367cf01804f7c6103dd95f9d42624d943cd964b8c2770219a1e46164f216a3aed60c25b85d0bb4d13189ccb13684ac57a2838ba3743cd5846531cc801cb - languageName: node - linkType: hard - "@react-native/assets-registry@npm:0.81.1": version: 0.81.1 resolution: "@react-native/assets-registry@npm:0.81.1" @@ -3616,21 +3609,6 @@ __metadata: languageName: node linkType: hard -"@react-native/codegen@npm:0.81.0": - version: 0.81.0 - resolution: "@react-native/codegen@npm:0.81.0" - dependencies: - glob: "npm:^7.1.1" - hermes-parser: "npm:0.29.1" - invariant: "npm:^2.2.4" - nullthrows: "npm:^1.1.1" - yargs: "npm:^17.6.2" - peerDependencies: - "@babel/core": "*" - checksum: 10c0/88e28b129fd57d92851b09377e10b4919e12ef6e3e1079327246e0dbf8bc9f4ca46f36559ff8eb03cb38f806f8df89638a27955e041a71b672d52f3e3e682031 - languageName: node - linkType: hard - "@react-native/codegen@npm:0.81.1": version: 0.81.1 resolution: "@react-native/codegen@npm:0.81.1" @@ -3648,27 +3626,6 @@ __metadata: languageName: node linkType: hard -"@react-native/community-cli-plugin@npm:0.81.0": - version: 0.81.0 - resolution: "@react-native/community-cli-plugin@npm:0.81.0" - dependencies: - "@react-native/dev-middleware": "npm:0.81.0" - debug: "npm:^4.4.0" - invariant: "npm:^2.2.4" - metro: "npm:^0.83.1" - metro-config: "npm:^0.83.1" - metro-core: "npm:^0.83.1" - semver: "npm:^7.1.3" - peerDependencies: - "@react-native-community/cli": "*" - "@react-native/metro-config": "*" - peerDependenciesMeta: - "@react-native-community/cli": - optional: true - checksum: 10c0/75e6896427bebddea8f5e0b3f59ebab726361420e7570cb584e6a7983766b2630dda22f2f007c7294099ed48f8f74e9a5f78112ab7bc2c20450a4fa9475a63b6 - languageName: node - linkType: hard - "@react-native/community-cli-plugin@npm:0.81.1": version: 0.81.1 resolution: "@react-native/community-cli-plugin@npm:0.81.1" @@ -3692,13 +3649,6 @@ __metadata: languageName: node linkType: hard -"@react-native/debugger-frontend@npm:0.81.0": - version: 0.81.0 - resolution: "@react-native/debugger-frontend@npm:0.81.0" - checksum: 10c0/c71998e9d60917d1b1a4ea8d5a1b390c762f41be8fd3a8d49a4138d36c53905361665e54d66929509940aa375eabbb7ba562212a169cf625a009ed8256fa71ec - languageName: node - linkType: hard - "@react-native/debugger-frontend@npm:0.81.1": version: 0.81.1 resolution: "@react-native/debugger-frontend@npm:0.81.1" @@ -3706,25 +3656,6 @@ __metadata: languageName: node linkType: hard -"@react-native/dev-middleware@npm:0.81.0": - version: 0.81.0 - resolution: "@react-native/dev-middleware@npm:0.81.0" - dependencies: - "@isaacs/ttlcache": "npm:^1.4.1" - "@react-native/debugger-frontend": "npm:0.81.0" - chrome-launcher: "npm:^0.15.2" - chromium-edge-launcher: "npm:^0.2.0" - connect: "npm:^3.6.5" - debug: "npm:^4.4.0" - invariant: "npm:^2.2.4" - nullthrows: "npm:^1.1.1" - open: "npm:^7.0.3" - serve-static: "npm:^1.16.2" - ws: "npm:^6.2.3" - checksum: 10c0/0dceef9c349e877b360821bcd1e6bd2340f6451ca81982d579daeb04ad650fa7c66ff07ccd5a4d36984b82c5f0ce347edf9aaafa34e8e3d6976e0aaf0232a4a8 - languageName: node - linkType: hard - "@react-native/dev-middleware@npm:0.81.1": version: 0.81.1 resolution: "@react-native/dev-middleware@npm:0.81.1" @@ -3744,13 +3675,6 @@ __metadata: languageName: node linkType: hard -"@react-native/gradle-plugin@npm:0.81.0": - version: 0.81.0 - resolution: "@react-native/gradle-plugin@npm:0.81.0" - checksum: 10c0/bba12c635d7c6048900c8f853f68c5e1bafa6b9ed3dc45126a48402f244c0a76dc0d065bef463c65a820e76884341f21983b4e54751503fc8fdf635dc100b93d - languageName: node - linkType: hard - "@react-native/gradle-plugin@npm:0.81.1": version: 0.81.1 resolution: "@react-native/gradle-plugin@npm:0.81.1" @@ -3758,13 +3682,6 @@ __metadata: languageName: node linkType: hard -"@react-native/js-polyfills@npm:0.81.0": - version: 0.81.0 - resolution: "@react-native/js-polyfills@npm:0.81.0" - checksum: 10c0/efdf1df388b5e1991e39c15caf8690eae619ddc24c34293f7e968683513a86b370c81171e655208084d7bdad83a604e1a898ad34e60276a005dcad0df03df3a8 - languageName: node - linkType: hard - "@react-native/js-polyfills@npm:0.81.1": version: 0.81.1 resolution: "@react-native/js-polyfills@npm:0.81.1" @@ -3772,13 +3689,6 @@ __metadata: languageName: node linkType: hard -"@react-native/normalize-colors@npm:0.81.0": - version: 0.81.0 - resolution: "@react-native/normalize-colors@npm:0.81.0" - checksum: 10c0/154b35202d4632a7129c8aa3a389ece6fe51d4180db360bf5e322a909e2515e099204ca7f67788d1dfa3775484c1949a4bb0db1757c4a80f4a1abbc5e5af07f0 - languageName: node - linkType: hard - "@react-native/normalize-colors@npm:0.81.1": version: 0.81.1 resolution: "@react-native/normalize-colors@npm:0.81.1" @@ -3793,23 +3703,6 @@ __metadata: languageName: node linkType: hard -"@react-native/virtualized-lists@npm:0.81.0": - version: 0.81.0 - resolution: "@react-native/virtualized-lists@npm:0.81.0" - dependencies: - invariant: "npm:^2.2.4" - nullthrows: "npm:^1.1.1" - peerDependencies: - "@types/react": ^19.1.0 - react: "*" - react-native: "*" - peerDependenciesMeta: - "@types/react": - optional: true - checksum: 10c0/06f411cd93b81abbdc24c0b4652bae2f93fa206f76f41be1534ead52b485ac76f837074923aed686b34cfa9a8454df1bd35a936dff4c1ed985abff582d1a6303 - languageName: node - linkType: hard - "@react-native/virtualized-lists@npm:0.81.1": version: 0.81.1 resolution: "@react-native/virtualized-lists@npm:0.81.1" @@ -4250,7 +4143,7 @@ __metadata: languageName: node linkType: hard -"@types/babel__core@npm:*, @types/babel__core@npm:^7, @types/babel__core@npm:^7.1.14": +"@types/babel__core@npm:^7, @types/babel__core@npm:^7.1.14": version: 7.20.5 resolution: "@types/babel__core@npm:7.20.5" dependencies: @@ -4291,15 +4184,6 @@ __metadata: languageName: node linkType: hard -"@types/connect@npm:^3.4.38": - version: 3.4.38 - resolution: "@types/connect@npm:3.4.38" - dependencies: - "@types/node": "npm:*" - checksum: 10c0/2e1cdba2c410f25649e77856505cd60223250fa12dff7a503e492208dbfdd25f62859918f28aba95315251fd1f5e1ffbfca1e25e73037189ab85dd3f8d0a148c - languageName: node - linkType: hard - "@types/conventional-commits-parser@npm:^5.0.0": version: 5.0.1 resolution: "@types/conventional-commits-parser@npm:5.0.1" @@ -4410,16 +4294,6 @@ __metadata: languageName: node linkType: hard -"@types/react-refresh@npm:^0": - version: 0.14.6 - resolution: "@types/react-refresh@npm:0.14.6" - dependencies: - "@types/babel__core": "npm:*" - csstype: "npm:^3.0.2" - checksum: 10c0/8a06ae4b3be6baf4bbe3a8c200df0a4730fbe6e9d09e4f03ceed59612328a28e711b920532cbbbd7aca082744ece51e957ae8b34f656fffb965b448fb0967ef1 - languageName: node - linkType: hard - "@types/react-test-renderer@npm:^19": version: 19.1.0 resolution: "@types/react-test-renderer@npm:19.1.0" @@ -11565,6 +11439,7 @@ __metadata: resolution: "react-native-css-example@workspace:example" dependencies: "@babel/core": "npm:^7.20.0" + "@expo/metro-runtime": "npm:~6.1.1" "@tailwindcss/postcss": "npm:^4.1.11" expo: "npm:54.0.0-preview.13" expo-dev-client: "npm:6.0.4" @@ -11572,7 +11447,7 @@ __metadata: expo-system-ui: "npm:6.0.6" react: "npm:19.1.0" react-dom: "npm:19.1.0" - react-native: "npm:0.81.0" + react-native: "npm:0.81.1" react-native-builder-bob: "npm:^0.40.13" react-native-monorepo-config: "npm:^0.1.9" react-native-reanimated: "npm:4.0.2" @@ -11589,17 +11464,14 @@ __metadata: "@babel/core": "npm:^7.28.0" "@commitlint/config-conventional": "npm:^19.8.1" "@eslint/js": "npm:^9.30.1" - "@expo/metro-runtime": "npm:~6.1.1" "@ianvs/prettier-plugin-sort-imports": "npm:^4.4.2" "@tailwindcss/postcss": "npm:^4.1.12" "@testing-library/react-native": "npm:^13.3.3" "@tsconfig/react-native": "npm:^3.0.6" "@types/babel__core": "npm:^7" - "@types/connect": "npm:^3.4.38" "@types/debug": "npm:^4.1.12" "@types/jest": "npm:^30.0.0" "@types/react": "npm:^19.1.10" - "@types/react-refresh": "npm:^0" "@types/react-test-renderer": "npm:^19" babel-plugin-react-compiler: "npm:^19.1.0-rc.2" babel-plugin-tester: "npm:^12.0.0" @@ -11637,7 +11509,7 @@ __metadata: expo: 54.0.0-preview.13 lightningcss: ">=1.27.0" react: 19.1.0 - react-native: 0.81.0 + react-native: 0.81.1 languageName: unknown linkType: soft @@ -11765,56 +11637,6 @@ __metadata: languageName: node linkType: hard -"react-native@npm:0.81.0": - version: 0.81.0 - resolution: "react-native@npm:0.81.0" - dependencies: - "@jest/create-cache-key-function": "npm:^29.7.0" - "@react-native/assets-registry": "npm:0.81.0" - "@react-native/codegen": "npm:0.81.0" - "@react-native/community-cli-plugin": "npm:0.81.0" - "@react-native/gradle-plugin": "npm:0.81.0" - "@react-native/js-polyfills": "npm:0.81.0" - "@react-native/normalize-colors": "npm:0.81.0" - "@react-native/virtualized-lists": "npm:0.81.0" - abort-controller: "npm:^3.0.0" - anser: "npm:^1.4.9" - ansi-regex: "npm:^5.0.0" - babel-jest: "npm:^29.7.0" - babel-plugin-syntax-hermes-parser: "npm:0.29.1" - base64-js: "npm:^1.5.1" - commander: "npm:^12.0.0" - flow-enums-runtime: "npm:^0.0.6" - glob: "npm:^7.1.1" - invariant: "npm:^2.2.4" - jest-environment-node: "npm:^29.7.0" - memoize-one: "npm:^5.0.0" - metro-runtime: "npm:^0.83.1" - metro-source-map: "npm:^0.83.1" - nullthrows: "npm:^1.1.1" - pretty-format: "npm:^29.7.0" - promise: "npm:^8.3.0" - react-devtools-core: "npm:^6.1.5" - react-refresh: "npm:^0.14.0" - regenerator-runtime: "npm:^0.13.2" - scheduler: "npm:0.26.0" - semver: "npm:^7.1.3" - stacktrace-parser: "npm:^0.1.10" - whatwg-fetch: "npm:^3.0.0" - ws: "npm:^6.2.3" - yargs: "npm:^17.6.2" - peerDependencies: - "@types/react": ^19.1.0 - react: ^19.1.0 - peerDependenciesMeta: - "@types/react": - optional: true - bin: - react-native: cli.js - checksum: 10c0/fb9dddb67046c7efae12175b81a563b4c302390d5879db4e2290321205155a1f6afa7ce9355d7e5af2bfe35b0aa0d5b5c0edb1c0d47b3252939b635043efba45 - languageName: node - linkType: hard - "react-native@npm:0.81.1": version: 0.81.1 resolution: "react-native@npm:0.81.1"