Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

CRA2 doesn't work with reflect-metadata package

See original GitHub issue

Is this a bug report?

Yes

Did you try recovering your dependencies?

Which terms did you search for in User Guide?

None

Environment

Environment Info:

  System:
    OS: Linux 4.4 Ubuntu 14.04.5 LTS, Trusty Tahr
    CPU: x64 Intel(R) Core(TM) i5-6600K CPU @ 3.50GHz
  Binaries:
    Node: 9.11.2 - /usr/local/bin/node
    Yarn: 1.6.0 - ~/.yarn/bin/yarn
    npm: 5.6.0 - ~/.npm-global/bin/npm
  Browsers:
    Chrome: 71.0.3578.98
    Firefox: 64.0
  npmPackages:
    @types/react: ^16.8.2 => 16.8.2 
    @types/react-dom: ^16.8.0 => 16.8.0 
    react: ^16.8.1 => 16.8.1 
    react-dom: ^16.8.1 => 16.8.1 
    react-scripts: 2.1.3 => 2.1.3 
  npmGlobalPackages:
    create-react-app: 1.5.2

Steps to Reproduce

Just follow the steps from the Reproducible Demo part and open console in browser.

Expected Behavior

Browsers console should print someProperty type: Number.

Actual Behavior

It prints couldn't get the type :(.

Reproducible Demo

git clone git@github.com:elderapo/cra2-reflect-metadata-bug.git
cd cra2-reflect-metadata-bug
yarn
yarn start

The problem

I think the problem is that babel completely strips out TS types before compilation process which makes it impossible for reflect-metadata package to do its work.

Issue Analytics

State:
Created 5 years ago
Reactions:8
Comments:20 (4 by maintainers)

Top GitHub Comments

21reactions

kmannislandscommented, Jul 1, 2020

@rmoedt I installed both and tried
const { override, addExternalBabelPlugin } = require("customize-cra");


module.exports = override(
  addExternalBabelPlugin("babel-plugin-transform-typescript-metadata")
);
But tsyringe still throws Error: TypeInfo not known

@Obiwarn I was running into the same issue with CRA x TSyringe. I didn’t try customize-cra but craco did it for me. See https://github.com/microsoft/tsyringe/issues/29#issuecomment-652596008

// craco.config.js
module.exports = function ({ env: _env }) {
    return {
        babel: {
            plugins: [
                "babel-plugin-transform-typescript-metadata"
            ]
        },
    };
};

5reactions

elderapocommented, Mar 13, 2019

Are there any plans regarding this issue?

I understand that there might not be an easy fix becuase of how babel compiles typescript. However, there are few nice libraries (ex. InversifyJS) that heavily rely on reflect-metadata package and the fact that cra-2 is not complatible is really discouraging.