Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[NoQA] Use official react-compiler-runtime package + fix fast refresh not refreshing components on mobile #51183

Merged
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion .eslintrc.js
Original file line number Diff line number Diff line change
Expand Up @@ -109,7 +109,6 @@ module.exports = {
'plugin:prettier/recommended',
],
plugins: ['@typescript-eslint', 'jsdoc', 'you-dont-need-lodash-underscore', 'react-native-a11y', 'react', 'testing-library', 'eslint-plugin-react-compiler', 'lodash', 'deprecation'],
ignorePatterns: ['lib/**'],
parser: '@typescript-eslint/parser',
parserOptions: {
project: path.resolve(__dirname, './tsconfig.json'),
Expand Down
2 changes: 0 additions & 2 deletions .prettierignore
Original file line number Diff line number Diff line change
Expand Up @@ -18,8 +18,6 @@ package-lock.json
*.markdown
# We need to modify the import here specifically, hence we disable prettier to get rid of the sorted imports
src/libs/E2E/reactNativeLaunchingTest.ts
# Temporary while we keep react-compiler in our repo
lib/**

# Automatically generated files
src/libs/SearchParser/searchParser.js
Expand Down
13 changes: 6 additions & 7 deletions babel.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,11 +3,14 @@ require('dotenv').config();
const IS_E2E_TESTING = process.env.E2E_TESTING === 'true';

const ReactCompilerConfig = {
runtimeModule: 'react-compiler-runtime',
target: '18',
environment: {
enableTreatRefLikeIdentifiersAsRefs: true,
},
// We exclude 'tests' directory from compilation, but still compile components imported in test files.
sources: (filename) => !filename.includes('tests/') && !filename.includes('node_modules/'),
};

/**
* Setting targets to node 20 to reduce JS bundle size
* It is also recommended by babel:
Expand Down Expand Up @@ -52,6 +55,8 @@ const webpack = {
const metro = {
presets: [require('@react-native/babel-preset')],
plugins: [
['babel-plugin-react-compiler', ReactCompilerConfig], // must run first!

// This is needed due to a react-native bug: https://github.com/facebook/react-native/issues/29084#issuecomment-1030732709
// It is included in metro-react-native-babel-preset but needs to be before plugin-proposal-class-properties or FlatList will break
'@babel/plugin-transform-flow-strip-types',
Expand Down Expand Up @@ -154,11 +159,5 @@ module.exports = (api) => {
const runningIn = api.caller((args = {}) => args.name);
console.debug(' - running in: ', runningIn);

// don't include react-compiler in jest, because otherwise tests will fail
if (runningIn !== 'babel-jest') {
// must run first!
metro.plugins.unshift(['babel-plugin-react-compiler', ReactCompilerConfig]);
}

return ['metro', 'babel-jest'].includes(runningIn) ? metro : webpack;
};
21 changes: 0 additions & 21 deletions lib/react-compiler-runtime/index.js

This file was deleted.

10 changes: 0 additions & 10 deletions lib/react-compiler-runtime/package.json

This file was deleted.

40 changes: 20 additions & 20 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

8 changes: 4 additions & 4 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -260,7 +260,7 @@
"babel-jest": "29.4.1",
"babel-loader": "^9.1.3",
"babel-plugin-module-resolver": "^5.0.0",
"babel-plugin-react-compiler": "0.0.0-experimental-334f00b-20240725",
"babel-plugin-react-compiler": "^19.0.0-beta-8a03594-20241020",
"babel-plugin-react-native-web": "^0.18.7",
"babel-plugin-transform-remove-console": "^6.9.4",
"clean-webpack-plugin": "^4.0.0",
Expand All @@ -281,7 +281,7 @@
"eslint-plugin-jest": "^28.6.0",
"eslint-plugin-jsdoc": "^46.2.6",
"eslint-plugin-lodash": "^7.4.0",
"eslint-plugin-react-compiler": "0.0.0-experimental-9ed098e-20240725",
"eslint-plugin-react-compiler": "^19.0.0-beta-8a03594-20241020",
"eslint-plugin-react-native-a11y": "^3.3.0",
"eslint-plugin-storybook": "^0.8.0",
"eslint-plugin-testing-library": "^6.2.2",
Expand All @@ -304,8 +304,8 @@
"portfinder": "^1.0.28",
"prettier": "^2.8.8",
"pusher-js-mock": "^0.3.3",
"react-compiler-healthcheck": "^0.0.0-experimental-ab3118d-20240725",
"react-compiler-runtime": "file:./lib/react-compiler-runtime",
"react-compiler-healthcheck": "^19.0.0-beta-8a03594-20241020",
"react-compiler-runtime": "^19.0.0-beta-8a03594-20241020",
"react-is": "^18.3.1",
"react-native-clean-project": "^4.0.0-alpha4.0",
"react-test-renderer": "18.3.1",
Expand Down
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
diff --git a/node_modules/react-compiler-healthcheck/dist/index.js b/node_modules/react-compiler-healthcheck/dist/index.js
index b427385..4bf23db 100755
index 5a4060d..460339b 100755
--- a/node_modules/react-compiler-healthcheck/dist/index.js
+++ b/node_modules/react-compiler-healthcheck/dist/index.js
@@ -69154,7 +69154,7 @@ var reactCompilerCheck = {
@@ -56969,7 +56969,7 @@ var reactCompilerCheck = {
compile(source, path);
}
},
Expand All @@ -11,11 +11,11 @@ index b427385..4bf23db 100755
const totalComponents =
SucessfulCompilation.length +
countUniqueLocInEvents(OtherFailures) +
@@ -69164,6 +69164,50 @@ var reactCompilerCheck = {
@@ -56979,6 +56979,50 @@ var reactCompilerCheck = {
`Successfully compiled ${SucessfulCompilation.length} out of ${totalComponents} components.`
)
);
+
+
+ if (verbose) {
+ for (const compilation of [...SucessfulCompilation, ...ActionableFailures, ...OtherFailures]) {
+ const filename = compilation.fnLoc?.filename;
Expand All @@ -38,33 +38,33 @@ index b427385..4bf23db 100755
+ if (compilation.kind === "CompileError") {
+ const { reason, severity, loc } = compilation.detail;
+
+ const lnNo = loc.start?.line;
+ const colNo = loc.start?.column;
+ const lnNo = loc.start?.line;
+ const colNo = loc.start?.column;
+
+ const isTodo = severity === ErrorSeverity.Todo;
+ const isTodo = severity === ErrorSeverity.Todo;
+
+ console.log(
+ chalk[isTodo ? 'yellow' : 'red'](
+ `Failed to compile ${
+ filename
+ }${
+ lnNo !== undefined ? `:${lnNo}${
+ colNo !== undefined ? `:${colNo}` : ""
+ }.` : ""
+ }`
+ ),
+ chalk[isTodo ? 'yellow' : 'red'](reason? `Reason: ${reason}` : "")
+ );
+ console.log("\n");
+ console.log(
+ chalk[isTodo ? 'yellow' : 'red'](
+ `Failed to compile ${
+ filename
+ }${
+ lnNo !== undefined ? `:${lnNo}${
+ colNo !== undefined ? `:${colNo}` : ""
+ }.` : ""
+ }`
+ ),
+ chalk[isTodo ? 'yellow' : 'red'](reason? `Reason: ${reason}` : "")
+ );
+ console.log("\n");
+ }
+ }
+ }
},
};
const JsFileExtensionRE = /(js|ts|jsx|tsx)$/;
@@ -69200,9 +69244,16 @@ function main() {
type: "string",
default: "**/+(*.{js,mjs,jsx,ts,tsx}|package.json)",
@@ -57015,9 +57059,16 @@ function main() {
type: 'string',
default: '**/+(*.{js,mjs,jsx,ts,tsx}|package.json)',
})
+ .option('verbose', {
+ description: 'run with verbose logging',
Expand All @@ -73,13 +73,13 @@ index b427385..4bf23db 100755
+ alias: 'v',
+ })
.parseSync();
const spinner = ora("Checking").start();
const spinner = ora('Checking').start();
let src = argv.src;
+ let verbose = argv.verbose;
const globOptions = {
onlyFiles: true,
ignore: [
@@ -69222,7 +69273,7 @@ function main() {
@@ -57037,7 +57088,7 @@ function main() {
libraryCompatCheck.run(source, path);
}
spinner.stop();
Expand Down
Original file line number Diff line number Diff line change
@@ -1,28 +1,28 @@
diff --git a/node_modules/react-compiler-healthcheck/dist/index.js b/node_modules/react-compiler-healthcheck/dist/index.js
index 4bf23db..fa2ab22 100755
index 460339b..17b0f96 100755
--- a/node_modules/react-compiler-healthcheck/dist/index.js
+++ b/node_modules/react-compiler-healthcheck/dist/index.js
@@ -69088,6 +69088,9 @@ const COMPILER_OPTIONS = {
compilationMode: "infer",
panicThreshold: "critical_errors",
logger: logger,
@@ -56902,6 +56902,9 @@ const COMPILER_OPTIONS = {
noEmit: true,
compilationMode: 'infer',
panicThreshold: 'critical_errors',
+ environment: {
+ enableTreatRefLikeIdentifiersAsRefs: true,
+ },
logger: logger,
};
function isActionableDiagnostic(detail) {
switch (detail.severity) {
diff --git a/node_modules/react-compiler-healthcheck/src/checks/reactCompiler.ts b/node_modules/react-compiler-healthcheck/src/checks/reactCompiler.ts
index 09c9b9b..d2418e0 100644
index 3094548..fd05b76 100644
--- a/node_modules/react-compiler-healthcheck/src/checks/reactCompiler.ts
+++ b/node_modules/react-compiler-healthcheck/src/checks/reactCompiler.ts
@@ -51,6 +51,9 @@ const COMPILER_OPTIONS: Partial<PluginOptions> = {
compilationMode: "infer",
panicThreshold: "critical_errors",
logger,
@@ -50,6 +50,9 @@ const COMPILER_OPTIONS: Partial<PluginOptions> = {
noEmit: true,
compilationMode: 'infer',
panicThreshold: 'critical_errors',
+ environment: {
+ enableTreatRefLikeIdentifiersAsRefs: true,
+ },
logger,
};

function isActionableDiagnostic(detail: CompilerErrorDetailOptions) {
Loading
Loading