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
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.