Is there an option in the tsconfig to compile a server and client to a public and private folder?

Question

I have a typescript project and I have the following file structure

builds
-dev
--public
--private
-production
--public
--private

src
-server
-client

tsconfig
package.json 

I want my src/server to compile to the private folders in build and the src/client to the public folders. I'm using Parcel as my compiler which uses the tsc. So my question is, can this be done with the compiler options of a single tsconfig. Because I noticed that you can only specify 1 output directory. Or would I have to make 2 tsconfigs in the server and client directory and somehow use both?

All the examples I could find were done with Webpack and I'm really set on using Parcel. Server & client-side TypeScript project organization, compilation

Answer 1

The following requires at least typescript version 3.0 in order to create a composite build.

See https://www.typescriptlang.org/docs/handbook/project-references.html

You will use two tsconfigs: one in src/server and one in src/client ; You will also need a root tsconfig.json .

In the root you will need:

"references": [{
    "path": "./src/client"
}, {
    "path": "./src/server"
}]

Then in src/client/tsconfig.json you will need the following:

"compilerOptions": {
    "outDir": "../../builds/dev/public",
    "rootDir": ".",
    "composite": true
}

Do the same for server .

Now when you run tsc --build , from the root directory, each of the subprojects will be built and placed in their respective outputs. Imports and exports will work as if everything existed in one project.

See project-references-demo project for complete example.