mirror of
https://github.com/facebook/react-native.git
synced 2025-11-01 09:14:26 +00:00
Tim Yung
f53f6137e6
Summary: Pull Request resolved: https://github.com/facebook/react-native/pull/52018 Migrates `View` to use Flow's [Component Syntax](https://flow.org/en/docs/react/component-syntax/). Component Syntax offers more concise syntax for expressing component definitions and eliminates the need for `View` to be cast as a component type. Component types improve type safety by more accurately modeling `ref` as props and enabling the use of modern type utilities such as `React.PropsOf<Component>` and `React.RefOf<Component>`. This represents the first introduction of Component Syntax in the open source React Native repository, which is lowered to standard JavaScript through the use of [`hermes-parser`](https://www.npmjs.com/package/hermes-parser) and the following supporting packages: - [`babel-plugin-syntax-hermes-parser`](https://www.npmjs.com/package/babel-plugin-syntax-hermes-parser) - [`hermes-eslint`](https://www.npmjs.com/package/hermes-eslint) - [`prettier-plugin-hermes-parser`](https://www.npmjs.com/package/prettier-plugin-hermes-parser) By default, [`react-native/babel-preset`](https://www.npmjs.com/package/react-native/babel-preset) already provides configuration for `babel-plugin-syntax-hermes-parser`. Although this is the first usage of Component Syntax, there are already Flow syntax features used in React Native that have required `hermes-parser` (e.g. [type casting expressions](https://flow.org/en/docs/types/casting/), [type guards](https://flow.org/en/docs/types/type-guards/), [const expressions](https://flow.org/en/docs/types/const-expression/)). As such, we do not anticipate this to introduce new build configuration problems for developers. Changelog: [Internal] Reviewed By: javache, NickGerleman Differential Revision: D76632879 fbshipit-source-id: e0a83dfc2e2014933000083de1825a311faad707