2

I'm trying to use Typescript Project references between 2 projects: client and shared the client/tsc -b process succeeds. but, on runtime imports of shared files fail.

the project structure is very simple:

./client
./client/tsconfig.json
./client/src
./client/src/app-load.tsx
./shared
./shared/tsconfig.json
./shared/src
./shared/src/validation-utils.ts

content of ./client/tsconfig.json

{
    "compilerOptions": {
        "module": "es2015",
        "target": "es2015",
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "moduleResolution": "node",
        "jsx": "react",
        "outDir": "build",
        "rootDir": "src",
        "baseUrl": "./",
        "allowSyntheticDefaultImports": true,
        "preserveConstEnums": true,
        "sourceMap": true,
        "skipLibCheck": true,
        "types": ["react", "react-native", "jest"],
        "paths": {
      "@shared/*": [
        "../shared/src/*"
      ]
    }
    },
    "compileOnSave": false,
    "exclude": ["android", "App.js", "ios", "build", "node_modules"],
    "references": [{ 
        "path": "../shared"
    }]
}

content of ./shared/tsconfig.json

{
  "compilerOptions": {
    "module": "es2015",
    "target": "es2015",
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "rootDir": "src",
    "outDir": "build",
    "baseUrl": "src",
    "composite": true,
    "declaration": true,
    "declarationMap": true,
  },
  "references": []
}

import used in ./client/src/app-load.tsx

import { isEmailValid } from "@shared/validation-utils";

error message on runtime

Unable to resolve "@shared/validation-utils" from "build/app-load.js" Failed building JavaScript bundle.

I've also tried replacing rootDir in client/tsconfig.json with

"include": [
  "src/**/*",
  "../shared/**/*"
],

like seen in other issues, still no success.

has anyone got an idea what am I doing wrong?

Ronny Roktel
  • 354
  • 2
  • 9
  • did you ever resolve this? I'm trying to figure this out as well: https://stackoverflow.com/questions/73029263/react-ts-cannot-add-private-shared-project-references-to-react-project – his dudeness Jul 18 '22 at 22:40

0 Answers0