root path for typescript module resolution

Question

I have two projects, which are using typescript. One is core project: moduleA, other one is business project: moduleB. ProjectB uses projectA's modules(ts files) located in /scripts folder. I want to specify module resolution root folder for projectB by projectA/scripts. Btw: Outs of the projects will be merged in production.

Here is my file structure

├───projectA
│   │   index.html
│   │   systemjs.config.js
│   │   tsconfig.json
│   │
│   └───scripts
│       └───core
│           │   app.ts
│           │   components.ts
│           │
│           └───components
│                   dropdown.ts
│
└───projectB
    │   tsconfig.json
    │
    └───scripts
        └───pages
                page.ts

For example: In projectB's page.ts I want to import core modules like below.

import { DropdownList } from 'core/components';

Actually I'm doing it that way. JavaScript output of page.ts works fine. But I need to fix typescript compile error: cannot find module "core/components".

I can do it by using npm install/link projectA/scripts in moduleB, or symlink. But I need to solve it by option of tsconfig.json or some kind of declaration file/references.d.ts/. Because, We have hundreds of projects kind of projectB. npm link or symlink will be awkward work for us.

Is there any easy way to do that?

Answer 1

Is there any easy way to do that

You need to use two things in your tsconfig.json :

• rootDirs to tell that projectA/scripts and projectB/scripts are right next to each other. (WARNING: does your compile time environment support it?).
• baseUrl if you want to use core/components instead of full relative paths ./core/components (WARNING: does your module loader support it?).

Both of these are support in http://alm.tools/ 🌹