Nx: @nrwl/react decorators not working

[ruohki]

I was toying around with typedjson (wich requires reflect-metadata and the decorator flags in the tsconfig)
but its not working

typedjson.js:179 @jsonMember on MyDataClass.prop1: could not resolve detected property constructor at runtime. Are you sure, that you have both "experimentalDecorators" and "emitDecoratorMetadata" in your tsconfig.json

is what i get. In @nrwl/node it works

Current Behavior

Error message pops in the console

Expected Behavior

That this works.

Steps to Reproduce

1. Create a @nrwl/react app, install reflect-metadata typedjson , setup allowSyntheticDefaultImports and emitDecoratorMetadata in your tsconfig
2. 
   ```import 'reflect-metadata';
   import { jsonObject, jsonMember, TypedJSON } from 'typedjson';

import React from 'react';
import ReactDOM from 'react-dom';

import App from './app/app';

@jsonObject
class MyDataClass
{
@jsonMember
public prop1: number;

@jsonMember
public prop2: string;

}

@jsonObject({
initializer: (json: Derived) => {
return new Derived(json.prop3);
}
})
class Derived extends MyDataClass {
@jsonMember
public prop3: number

@jsonMember
public prop4: number;

constructor(prop: number) {
  super();
  this.prop3 = prop;
  this.prop4 = 69
}

method() {
  console.log(this.prop3, this.prop4)
}

}

const serializer = new TypedJSON(Derived);
const object = new Derived(20);
object.prop4 = 420;

const json = serializer.stringify(object);
const object2 = serializer.parse(json);
object2.method();

console.log(object2 instanceof MyDataClass); // true

ReactDOM.render(, document.getElementById('root'));
``` use that in your main.tsx

[ruohki]

Turns out i had to use some custom babel plugins to make it work

.babelrc

{
  "plugins": [
    "babel-plugin-transform-typescript-metadata",
    ["@babel/plugin-proposal-decorators", { "legacy": true }],
    ["@babel/plugin-proposal-class-properties", { "loose": true }]
  ],
  "presets": [
    "@babel/preset-typescript"
  ]
}

[Hotell]

what version of nx are you using?

This feature was added in 9.4 by supporting babel.config.js with .babelrc as children per lib/app

• you can run migration script
  

• which will use following babel preset in root config: https://github.com/nrwl/nx/blob/master/packages/web/babel.ts

• and following preset per react lib config: https://github.com/nrwl/nx/blob/master/packages/react/babel.ts