From b431236fe6fd3aca092c9287b38791db85a4ca4a Mon Sep 17 00:00:00 2001 From: Jakub Romanczyk Date: Wed, 4 Dec 2024 19:02:22 +0100 Subject: [PATCH 1/6] fix: add transform react jsx automatic to node module rules --- .../src/rules/nodeModulesLoadingRules.ts | 45 ++++++++++++++++++- 1 file changed, 43 insertions(+), 2 deletions(-) diff --git a/packages/repack/src/rules/nodeModulesLoadingRules.ts b/packages/repack/src/rules/nodeModulesLoadingRules.ts index 0b7fd029e..d842ff6c3 100644 --- a/packages/repack/src/rules/nodeModulesLoadingRules.ts +++ b/packages/repack/src/rules/nodeModulesLoadingRules.ts @@ -19,7 +19,7 @@ export const NODE_MODULES_LOADING_RULES: RuleSetRule = { 'react-native-tvos', '@callstack/react-native-visionos', ]), - rules: [ + oneOf: [ { test: /jsx?$/, use: [ @@ -35,6 +35,11 @@ export const NODE_MODULES_LOADING_RULES: RuleSetRule = { syntax: 'ecmascript', jsx: true, }, + transform: { + react: { + runtime: 'automatic', + }, + }, externalHelpers: true, }, module: { @@ -47,7 +52,38 @@ export const NODE_MODULES_LOADING_RULES: RuleSetRule = { ], }, { - test: /tsx?$/, + test: /ts$/, + use: [ + { + loader: 'builtin:swc-loader', + options: { + env: { + targets: { 'react-native': '0.74' }, + }, + jsc: { + parser: { + syntax: 'typescript', + tsx: false, + }, + transform: { + react: { + runtime: 'automatic', + }, + }, + loose: true, + externalHelpers: true, + }, + module: { + type: 'commonjs', + strict: false, + strictMode: false, + }, + }, + }, + ], + }, + { + test: /tsx$/, use: [ { loader: 'builtin:swc-loader', @@ -60,6 +96,11 @@ export const NODE_MODULES_LOADING_RULES: RuleSetRule = { syntax: 'typescript', tsx: true, }, + transform: { + react: { + runtime: 'automatic', + }, + }, loose: true, externalHelpers: true, }, From b7dde271a104f009cb5e447080e21650943a63ce Mon Sep 17 00:00:00 2001 From: Jakub Romanczyk Date: Wed, 4 Dec 2024 19:03:25 +0100 Subject: [PATCH 2/6] fix: add transform react jsx automatic to react native rules --- packages/repack/src/rules/reactNativeLoadingRules.ts | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/packages/repack/src/rules/reactNativeLoadingRules.ts b/packages/repack/src/rules/reactNativeLoadingRules.ts index 6b65fe757..d621c3b85 100644 --- a/packages/repack/src/rules/reactNativeLoadingRules.ts +++ b/packages/repack/src/rules/reactNativeLoadingRules.ts @@ -31,6 +31,11 @@ export const REACT_NATIVE_LOADING_RULES: RuleSetRule = { jsx: true, exportDefaultFrom: true, }, + transform: { + react: { + runtime: 'automatic', + }, + }, loose: true, externalHelpers: true, }, From af32cca8977893d0043cdfbb0b00a7a09dd9fac8 Mon Sep 17 00:00:00 2001 From: Jakub Romanczyk Date: Wed, 4 Dec 2024 19:09:03 +0100 Subject: [PATCH 3/6] refactor: reorder props in rules --- packages/repack/src/rules/nodeModulesLoadingRules.ts | 10 +++++----- packages/repack/src/rules/reactNativeLoadingRules.ts | 4 ++-- 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/packages/repack/src/rules/nodeModulesLoadingRules.ts b/packages/repack/src/rules/nodeModulesLoadingRules.ts index d842ff6c3..83864ba33 100644 --- a/packages/repack/src/rules/nodeModulesLoadingRules.ts +++ b/packages/repack/src/rules/nodeModulesLoadingRules.ts @@ -30,6 +30,7 @@ export const NODE_MODULES_LOADING_RULES: RuleSetRule = { targets: { 'react-native': '0.74' }, }, jsc: { + externalHelpers: true, loose: true, parser: { syntax: 'ecmascript', @@ -40,7 +41,6 @@ export const NODE_MODULES_LOADING_RULES: RuleSetRule = { runtime: 'automatic', }, }, - externalHelpers: true, }, module: { type: 'commonjs', @@ -61,6 +61,8 @@ export const NODE_MODULES_LOADING_RULES: RuleSetRule = { targets: { 'react-native': '0.74' }, }, jsc: { + externalHelpers: true, + loose: true, parser: { syntax: 'typescript', tsx: false, @@ -70,8 +72,6 @@ export const NODE_MODULES_LOADING_RULES: RuleSetRule = { runtime: 'automatic', }, }, - loose: true, - externalHelpers: true, }, module: { type: 'commonjs', @@ -92,6 +92,8 @@ export const NODE_MODULES_LOADING_RULES: RuleSetRule = { targets: { 'react-native': '0.74' }, }, jsc: { + externalHelpers: true, + loose: true, parser: { syntax: 'typescript', tsx: true, @@ -101,8 +103,6 @@ export const NODE_MODULES_LOADING_RULES: RuleSetRule = { runtime: 'automatic', }, }, - loose: true, - externalHelpers: true, }, module: { type: 'commonjs', diff --git a/packages/repack/src/rules/reactNativeLoadingRules.ts b/packages/repack/src/rules/reactNativeLoadingRules.ts index d621c3b85..0c81a0df3 100644 --- a/packages/repack/src/rules/reactNativeLoadingRules.ts +++ b/packages/repack/src/rules/reactNativeLoadingRules.ts @@ -26,6 +26,8 @@ export const REACT_NATIVE_LOADING_RULES: RuleSetRule = { targets: { 'react-native': '0.74' }, }, jsc: { + externalHelpers: true, + loose: true, parser: { syntax: 'ecmascript', jsx: true, @@ -36,8 +38,6 @@ export const REACT_NATIVE_LOADING_RULES: RuleSetRule = { runtime: 'automatic', }, }, - loose: true, - externalHelpers: true, }, module: { type: 'commonjs', From 36768211d29aaab3467cfb878c92f99be7d3a1b2 Mon Sep 17 00:00:00 2001 From: Jakub Romanczyk Date: Wed, 4 Dec 2024 19:16:17 +0100 Subject: [PATCH 4/6] refactor: reuse most of the config in node module rules --- .../src/rules/nodeModulesLoadingRules.ts | 114 +++++------------- 1 file changed, 30 insertions(+), 84 deletions(-) diff --git a/packages/repack/src/rules/nodeModulesLoadingRules.ts b/packages/repack/src/rules/nodeModulesLoadingRules.ts index 83864ba33..3ae5396b9 100644 --- a/packages/repack/src/rules/nodeModulesLoadingRules.ts +++ b/packages/repack/src/rules/nodeModulesLoadingRules.ts @@ -1,6 +1,33 @@ import type { RuleSetRule } from '@rspack/core'; import { getModulePaths } from '../utils'; +const makeSwcLoaderConfig = (syntax: 'js' | 'ts', jsx: boolean) => ({ + loader: 'builtin:swc-loader', + options: { + env: { + targets: { 'react-native': '0.74' }, + }, + jsc: { + externalHelpers: true, + loose: true, + parser: + syntax === 'js' + ? { syntax: 'ecmascript', jsx: jsx } + : { syntax: 'typescript', tsx: jsx }, + transform: { + react: { + runtime: 'automatic', + }, + }, + }, + module: { + type: 'commonjs', + strict: false, + strictMode: false, + }, + }, +}); + /** * @constant NODE_MODULES_LOADING_RULES * @type {RuleSetRule} @@ -22,96 +49,15 @@ export const NODE_MODULES_LOADING_RULES: RuleSetRule = { oneOf: [ { test: /jsx?$/, - use: [ - { - loader: 'builtin:swc-loader', - options: { - env: { - targets: { 'react-native': '0.74' }, - }, - jsc: { - externalHelpers: true, - loose: true, - parser: { - syntax: 'ecmascript', - jsx: true, - }, - transform: { - react: { - runtime: 'automatic', - }, - }, - }, - module: { - type: 'commonjs', - strict: false, - strictMode: false, - }, - }, - }, - ], + use: [makeSwcLoaderConfig('js', true)], }, { test: /ts$/, - use: [ - { - loader: 'builtin:swc-loader', - options: { - env: { - targets: { 'react-native': '0.74' }, - }, - jsc: { - externalHelpers: true, - loose: true, - parser: { - syntax: 'typescript', - tsx: false, - }, - transform: { - react: { - runtime: 'automatic', - }, - }, - }, - module: { - type: 'commonjs', - strict: false, - strictMode: false, - }, - }, - }, - ], + use: [makeSwcLoaderConfig('ts', false)], }, { test: /tsx$/, - use: [ - { - loader: 'builtin:swc-loader', - options: { - env: { - targets: { 'react-native': '0.74' }, - }, - jsc: { - externalHelpers: true, - loose: true, - parser: { - syntax: 'typescript', - tsx: true, - }, - transform: { - react: { - runtime: 'automatic', - }, - }, - }, - module: { - type: 'commonjs', - strict: false, - strictMode: false, - }, - }, - }, - ], + use: [makeSwcLoaderConfig('ts', true)], }, ], }; From 72567670b1e63415782d870ea9f8b9718b76e230 Mon Sep 17 00:00:00 2001 From: Jakub Romanczyk Date: Wed, 4 Dec 2024 19:21:45 +0100 Subject: [PATCH 5/6] chore: update Podfile.lock --- apps/tester-app/ios/Podfile.lock | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/apps/tester-app/ios/Podfile.lock b/apps/tester-app/ios/Podfile.lock index ec95be548..58c4b7934 100644 --- a/apps/tester-app/ios/Podfile.lock +++ b/apps/tester-app/ios/Podfile.lock @@ -1,6 +1,6 @@ PODS: - boost (1.84.0) - - callstack-repack (5.0.0-rc.0): + - callstack-repack (5.0.0-rc.2): - DoubleConversion - glog - hermes-engine @@ -1852,7 +1852,7 @@ EXTERNAL SOURCES: SPEC CHECKSUMS: boost: 1dca942403ed9342f98334bf4c3621f011aa7946 - callstack-repack: 75464b0e26467fc4a7236373399bc0fc2281f495 + callstack-repack: 3106db24c24f7a76a380230ff7794d225cecb760 DoubleConversion: f16ae600a246532c4020132d54af21d0ddb2a385 FBLazyVector: 7075bb12898bc3998fd60f4b7ca422496cc2cdf7 fmt: 10c6e61f4be25dc963c36bd73fc7b1705fe975be From 8f8cb4dbb17b217a1fec31aec370c4e0a9d5096f Mon Sep 17 00:00:00 2001 From: Jakub Romanczyk Date: Wed, 4 Dec 2024 19:24:15 +0100 Subject: [PATCH 6/6] chore: add changeset --- .changeset/slimy-dragons-swim.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/slimy-dragons-swim.md diff --git a/.changeset/slimy-dragons-swim.md b/.changeset/slimy-dragons-swim.md new file mode 100644 index 000000000..d88c47448 --- /dev/null +++ b/.changeset/slimy-dragons-swim.md @@ -0,0 +1,5 @@ +--- +"@callstack/repack": patch +--- + +Fix type JSX runtime transform when transpiling node modules