CODEWITHSUNDEEP
javascriptbashtypescripttypescript2.0tsc
Alexander Mills
Alexander Mills

Reputation: 100080

Transpile all TypeScript files to a relative adjacent directory

I am writing our JavaScript based tests with TypeScript.

I would like a single tsc --watch command, to be able to handle transpiling all of our files correctly, that's the key part. I think using multiple tsconfig.json files is the way to go here.

I have this structure:

/tests
  /e2e
     tsconfig.json
    /src
    /target
  /unit
     tsconfig.json
    /src
    /target

I want to put the TypeScript files in the src directories, and transpile them into the target directories.

My question is - if you have a bash script that can take a list of files as input, how could you transpile the files into their respective target directory?

e.g., input files:

/home/you/projects/x/test/e2e/src/a.ts
/home/you/projects/x/test/e2e/src/b.ts
/home/you/projects/x/test/e2e/src/c.ts
/home/you/projects/x/test/unit/src/foo.ts
/home/you/projects/x/test/unit/src/bar.ts
/home/you/projects/x/test/unit/src/baz.ts

desired output files:

/home/you/projects/x/test/e2e/target/a.js
/home/you/projects/x/test/e2e/target/b.js
/home/you/projects/x/test/e2e/target/c.js
/home/you/projects/x/test/unit/target/foo.js
/home/you/projects/x/test/unit/target/bar.js
/home/you/projects/x/test/unit/target/baz.js

Is there a way for the tsc command to take those files and transpile them all in one a one line command to their respective target directories?

I assume that might be very tricky to do. I might have to group them by their dirname, and transpile each group separately. That would be much harder.

Upvotes: 1

Views: 1114

Answers (2)

Alexander Mills
Alexander Mills

Reputation: 100080

I created a tool to do this:

github.com/ORESoftware/tsc-multi-watch

It will search your project for /tsconfig.*\.json/ files, and spawn a tsc -w process for each one.

Not only that but it solves another deficiency of tsc --watch. tsc --watch cannot account for new files that are added to the project.

tsc-multi-watch will restart the correct tsc -w process when a .ts file is added to the project.

Upvotes: 0

Burt_Harris
Burt_Harris

Reputation: 6874

I don't think you can get the native tsc --watch to support that project structure, but you can using gulp and gulp-typescript. They permit you to setup simultaneous watches on several different TypeScript projects, each with their own tsconfig.json.

If there are dependencies between those subdirectories, consider using lerna as well. Otherwise you may end up with a surprising layout in your target directories. An extra level of directories was the initial problem which got me looking into this. With lerna, you will setup separate package.json files which document the dependencies. Then lerna bootstrap can take care of setting up symbolic links to resolve the references.

With lerna, you may want to mark some of the package.json files as "private": true, if they are not intended to be published to npm.

Upvotes: 1

Related Questions