ds300/react-native-typescript-transformer

How to enable decorators support?

alexmbp opened this issue · 4 comments

alexmbp commented

I use react-native-typescript-transformer because I need fully working decorators to use with my DI library (https://github.com/inversify/InversifyJS)

I have reflect-metadata installed and transformer is working, but looks like decorators metadata lost somewhere.

My tsconfig

{
  "compilerOptions": {
    "target": "es2015",
    "module": "commonjs",
    "lib": ["es6"],
    "jsx": "react",
    "sourceMap": true,
    "noEmit": true,
    "importHelpers": true,
    "strict": true,
    "strictPropertyInitialization": false,
    "moduleResolution": "node",
    "types": ["reflect-metadata"],
    "esModuleInterop": true,
    "resolveJsonModule": true,
    "experimentalDecorators": true,
    "emitDecoratorMetadata": true
  },
  "exclude": ["node_modules"]
}

Additionally I see, that TS part works ok

import * as tslib_1 from "tslib";
import { injectable } from 'inversify';
let TestInjection = class TestInjection {
    constructor() {
        console.warn('TestInjection instance created');
    }
    sayHello() {
        console.warn('Hello!');
    }
};
TestInjection = tslib_1.__decorate([
    injectable(),
    tslib_1.__metadata("design:paramtypes", [])
], TestInjection);
export default TestInjection;
//# sourceMappingURL=TestInjection.js.map
ds300 commented
  • 👍1
alexmbp commented

@ds300 Yes. I did. Generally I've found an issue. Issue was with code itself. I was thinking about babel/transformer, because where trying to make decorators working with babel plugins for proposal decorators, but caught an issues with property decorators. Everything is good with transformer.
Thank you!

Roaders commented

@alexmbp did you get this working? I am having similar issues getting Ivversify working with React. Do you have an example repo where you manage to get this working?
Thanks

sjerratsch commented

@Roaders
This package solved it for me. Babel removes the metadata from "reflect-metadata". Not sure if this exactly fits your problem, but maybe someone will find this link helpful: https://www.npmjs.com/package/babel-plugin-transform-typescript-metadata