Created by: pekala
Fixes https://github.com/facebook/create-react-app/issues/8918
Type-only class fields using the declare
keyword were added by TS 3.7. CRA currently fails when it encounters them with the following error:
TypeScript 'declare' fields must first be transformed by @babel/plugin-transform-typescript.
If you have already enabled that plugin (or '@babel/preset-typescript'), make sure that it runs before any plugin related to additional class features:
- @babel/plugin-proposal-class-properties
- @babel/plugin-proposal-private-methods
- @babel/plugin-proposal-decorators
Declare fields are useful when using React context in class components, e.g.:
class MyComponent extends Component<MyProps> {
static contextType = MyContext
declare context: React.ContextType<typeof MyContext>
This PR switches from Babel TS preset to Babel TS transform plugin in order to run the babel transform before @babel/plugin-proposal-class-properties
. It also switches the support for declare fields by using the allowDeclareFields
option on the plugin. This will be the default for Babel 8, but for now, we need to use the option.
The preset to plugin switch should have no other effect since the babel TS preset wraps only one plugin and provides little more than the transform plugin itself.