React/react-native
1
0
Fork 0
mirror of https://github.com/facebook/react-native.git synced 2024-11-21 21:27:46 +00:00
Code Issues Actions 10 Packages Projects Releases Wiki Activity

Switch Babel parsing from legacy Flow plugin to hermes-parser (#46696)

Browse Source 
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46696

Following D62161923, we began to lose sync with modern Flow syntax when Metro's `transformer.hermesParser` option is disabled. This config option loads Babel for transformation (instead of `hermes-parser`), which requires a Babel plugin to parse (not strip) Flow syntax.

This diff migrates us away from `babel/plugin-syntax-flow` (see also https://github.com/babel/babel/issues/16264) and uses the modern [`babel-plugin-syntax-hermes-parser`](https://www.npmjs.com/package/babel-plugin-syntax-hermes-parser) instead (a component of the modern Hermes Parser stack).

Following this change, new projects that unset `transformer.hermesParser` will compile.

Resolves https://github.com/facebook/react-native/issues/46601.

Changelog:
[General][Fixed] - Fix parsing of modern Flow syntax when `transformer.hermesParser = false` is configured in Metro config

Reviewed By: cipolleschi

Differential Revision: D63535216

fbshipit-source-id: d2c6ddec030d89e2698e03b76194cf3568d04e6b
This commit is contained in:
Alex Hunt 2024-09-27 10:20:19 -07:00 committed by Facebook GitHub Bot
parent dc8bc45cfa
commit 1387f521fd
3 changed files with 11 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
packages/react-native-babel-preset/package.json
View File

@ -15,23 +15,16 @@
"license": "MIT",
"dependencies": {
"@babel/core": "^7.25.2",
"@babel/plugin-transform-async-generator-functions": "^7.25.4",
"@babel/plugin-transform-class-properties": "^7.25.4",
"@babel/plugin-proposal-export-default-from": "^7.24.7",
"@babel/plugin-transform-logical-assignment-operators": "^7.24.7",
"@babel/plugin-transform-nullish-coalescing-operator": "^7.24.7",
"@babel/plugin-transform-numeric-separator": "^7.24.7",
"@babel/plugin-transform-object-rest-spread": "^7.24.7",
"@babel/plugin-transform-optional-catch-binding": "^7.24.7",
"@babel/plugin-transform-optional-chaining": "^7.24.8",
"@babel/plugin-syntax-dynamic-import": "^7.8.3",
"@babel/plugin-syntax-export-default-from": "^7.24.7",
"@babel/plugin-syntax-flow": "^7.24.7",
"@babel/plugin-syntax-nullish-coalescing-operator": "^7.8.3",
"@babel/plugin-syntax-optional-chaining": "^7.8.3",
"@babel/plugin-transform-arrow-functions": "^7.24.7",
"@babel/plugin-transform-async-generator-functions": "^7.25.4",
"@babel/plugin-transform-async-to-generator": "^7.24.7",
"@babel/plugin-transform-block-scoping": "^7.25.0",
"@babel/plugin-transform-class-properties": "^7.25.4",
"@babel/plugin-transform-classes": "^7.25.4",
"@babel/plugin-transform-computed-properties": "^7.24.7",
"@babel/plugin-transform-destructuring": "^7.24.8",
@ -39,8 +32,14 @@
"@babel/plugin-transform-for-of": "^7.24.7",
"@babel/plugin-transform-function-name": "^7.25.1",
"@babel/plugin-transform-literals": "^7.25.2",
"@babel/plugin-transform-logical-assignment-operators": "^7.24.7",
"@babel/plugin-transform-modules-commonjs": "^7.24.8",
"@babel/plugin-transform-named-capturing-groups-regex": "^7.24.7",
"@babel/plugin-transform-nullish-coalescing-operator": "^7.24.7",
"@babel/plugin-transform-numeric-separator": "^7.24.7",
"@babel/plugin-transform-object-rest-spread": "^7.24.7",
"@babel/plugin-transform-optional-catch-binding": "^7.24.7",
"@babel/plugin-transform-optional-chaining": "^7.24.8",
"@babel/plugin-transform-parameters": "^7.24.7",
"@babel/plugin-transform-private-methods": "^7.24.7",
"@babel/plugin-transform-private-property-in-object": "^7.24.7",
@ -57,6 +56,7 @@
"@babel/plugin-transform-unicode-regex": "^7.24.7",
"@babel/template": "^7.25.0",
"@react-native/babel-plugin-codegen": "0.77.0-main",
"babel-plugin-syntax-hermes-parser": "^0.23.1",
"babel-plugin-transform-flow-enums": "^0.0.2",
"react-refresh": "^0.14.0"
},

2
packages/react-native-babel-preset/src/configs/main.js vendored
View File

@ -25,7 +25,7 @@ function isTSXSource(fileName) {
const loose = true;
const defaultPlugins = [
[require('@babel/plugin-syntax-flow')],
[require('babel-plugin-syntax-hermes-parser')],
[require('babel-plugin-transform-flow-enums')],
[require('@babel/plugin-transform-block-scoping')],
[require('@babel/plugin-transform-class-properties'), {loose}],

6
packages/react-native/jest-preset.js vendored
View File

@ -15,11 +15,7 @@ module.exports = {
platforms: ['android', 'ios', 'native'],
},
transform: {
'^.+\\.(js)$': [
'babel-jest',
{plugins: ['babel-plugin-syntax-hermes-parser']},
],
'^.+\\.(ts|tsx)$': 'babel-jest',
'^.+\\.(js|ts|tsx)$': 'babel-jest',
'^.+\\.(bmp|gif|jpg|jpeg|mp4|png|psd|svg|webp)$': require.resolve(
'./jest/assetFileTransformer.js',
),