Could not resolve detected property at runtime

[edwardigates]

Hi, I'm using this library with React-Native and I followed the instructions here. However when I try to run the project I get an error syaing: @jsonMember on AppFile.Id could not resolve detected property constructor at runtime. Are you sure, that you have both "experimentalDecorators" and "emitDecoratorMetadata" in your tscofig.json? .

This is my model for AppFile:

import 'reflect-metadata';
import { jsonObject, jsonMember, TypedJSON } from 'typedjson';

@jsonObject
export class AppFile {

    @jsonMember
    Id?: string;

    @jsonMember
    Group?: string;

    @jsonMember
    Name?: string;

    @jsonMember
    Value?: string;
    
    @jsonMember
    Active?: boolean;

    @jsonMember
    CacheTime?: number;
}

I added "experimentalDecorators": true and "emitDecoratorMetadata": true in tsconfig.josn. I also added "plugins": [ ["@babel/plugin-proposal-decorators", { "legacy": true }]] in babel.config.js.

But nothing seems to work, what is the problem with my setup?

[MatthiasKunnen]

You are using both TypeScript and Babel? Perhaps that is where the problem lies. What do you need Babel for that TypeScript cannot do?

[edwardigates]

You are using both TypeScript and Babel? Perhaps that is where the problem lies. What do you need Babel for that TypeScript cannot do?

@MatthiasKunnen I added the babel plugin because I was getting this error Syntax error - Support for the experimental syntax 'decorators-legacy' isn't currently enabled - after adding the plugin the error disappeared.

[Neos3452]

Hi @edwardigates, would you mind creating a simplified example repository? It is hard for me to find a cause for the error without looking at configuration files, especially that it uses react, and big frameworks have tendency to add custom build steps on top of tsc. Regarding babel, I must say that I have not tested TypedJSON with babel, only using the regular typescript compiler. I know that in the past babel had limited typescript support, not sure what the status is today, but you might need to specify types manually as I think integration with reflect-metadata is tsc specific.

[MatthiasKunnen]

@edwardigates, could you elaborate on why you are using babel on top of TypeScript? Or am I misunderstanding and is your stack different?

[jeromeheissler]

I fix this issue by adding babel-plugin-transform-typescript-metadata

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

[florianbepunkt]

@jeromeheissler Thank you so much for posting this, saved my day.