3

I'm trying to share my Typeorm entity classes with my frontend without pulling in all of the typeorm package as it greatly increased my build size.

The suggestion in the past has been to add the Typeorm shim to your Webpack build, which basically makes all the Typeorm entities do nothing. https://github.com/typeorm/typeorm/blob/master/extra/typeorm-model-shim.js

This involves modifying your tsconfig.json file like this:

{
  ...
  "compilerOptions": {
    ...
    "paths": {
      "typeorm": ["../node_modules/typeorm/typeorm-model-shim.js"]
    }
  }
}

The problem is that create-react-app now removes compilerOptions.paths from your tsconfig.json file. I do not know why it does this, but it's now making it impossible to include this shim.

Is there a way to use the Typeorm shim with create-react-app? Is there an alternative solution for using my Typeorm entities in my frontend?

leros
  • 485
  • 6
  • 16
  • there were some workarounds but they seem not to work with current versions of cra, sorry but you'll have to eject https://stackoverflow.com/questions/53794875/how-to-configure-react-script-so-that-it-doesnt-override-tsconfig-json-on-star – diedu Oct 09 '20 at 02:08

1 Answers1

1

It seems there are some ways to make path alias work with cra, see this question create-react-app Typescript 3.5, Path Alias, however I have not tried tried them to not risk making my setup more brittle.

Since I am running also running my dev end in docker/containers, I've added this in Dockerfile.dev for my front-end container before npm start:

RUN find /src -name \*.ts | xargs sed -ie 's!from "typeorm"!from "typeorm/typeorm-model-shim"!g'

Currently I don't see any downsides, will update the answer if I find any problem...

acristu
  • 721
  • 6
  • 19