How to configure tsconfig.json to output files from multiple source folders to single flat outDir?

Question

I have multiple typescript projects (e.g. client and server), which share some common functionality (located in a common folder). Consider this folder structure:

+ client
|  - tsconfig.json
|  + src
|     - client.ts
+ common
   + src
      - util.ts

Where the client.ts imports the utility this way:

import { Util } from '../../common/src/util';

For brevity I am omitting the server folder, which is at the same level as client. After the transpilation into the out folder, I would like to get this simple flat folder structure:

+ client
|  + out
|     - client.js
|     - util.js

... and ideally I could simply import the common utility agnostic of the actual folder:

import { Util } from './util';

How do I configure the tsconfig.json to achieve that?

I tried different combinations of rootDirs, baseUrl and paths, but I am still getting the client and common subfolders (both even including their src subfolder) under out.

Answer 1

And now we have the support for project references in Typescript 3.0 (i.e. cascade build of multiple Typescript projects). We can also control the output location of the tsc builds.

https://blogs.msdn.microsoft.com/typescript/2018/07/30/announcing-typescript-3-0/#project-references

If a Typescript project 'bar' uses project 'foo', here is how you chain them:

// ./src/bar/tsconfig.json
{
    "compilerOptions": {
        // Needed for project references.
        "composite": true,
        "declaration": true,

        // Other options...
        "outDir": "../../lib/bar",
        "strict": true, "module": "esnext", "moduleResolution": "node",
    },
    "references": [
        { "path": "../foo" }
    ]
}

Thanks, TS guys!