PHPStorm IDE TypeScript File Watcher

Question

By default in PHPStorm 6 the compiled *.js are created in the same folder than the *.ts files.

What I need is that the compiled *.js and *.d.js be in a different subdirectory than the same of the *.ts files.

In resume:

I have the root folder "Project"
I have a subfolder "ts" which all *.ts files resides.
I have a subfolder "scripts" where I want the compiled *.js and *.d.js be.

How can I accomplish this with PHPStorm TypeScript file watcher?

I've tried several macros like in the Output field at the File Watcher dialog like:

$FileParentDir$/scripts/$FileNameWithoutExtension$.js:$FileParentDir$/scripts/$FileNameWithoutExtension$.js.map

but none of them worked.

Should be similar to LESS and JADE file watchers configuration with the output in different subdirectories. — CrazyCoder
– CrazyCoder, Commented Apr 18, 2013 at 13:34
@CrazyCoder: Thanks, that pointed me in the right direction but not solver my issue. For your help I voted both of your answers there :D Thanks again. — Diosney
– Diosney, Commented Apr 18, 2013 at 13:56

lena · Accepted Answer · 2013-04-18 14:13:19Z

5

The 'Output paths' field in File Watcher configuration just tells the IDE where to look for created files (used for auto-synchronization) and has no meaning for the program being run. TypeScript compiler has the --out option that tells the compiler where to put the generated files

Please, try the following:

Arguments: --sourcemap $FileName$ --out $ProjectFileDir$/scripts/$FileNameWithoutExtension$.js

Working directory: $FileDir$

Output Paths: $ProjectFileDir$/bin/$FileNameWithoutExtension$.js:$ProjectFileDir$/bin/$FileNameWithoutExtension$.js.map

Hope this helps

answered Apr 18, 2013 at 14:13

lena

94.4k11 gold badges154 silver badges160 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Diosney · Accepted Answer · 2014-05-08 11:41:42Z

3

Thanks to @CrazyCoder's references I (finally!) managed to bring this to working fine.

The output file path you have to specify it in the Arguments parameter, not in the Output path's one.

The trick was that --out doesn't accept folder paths, instead you have to use the file path.

See image for reference of a fully functional configuration.

In this configuration the organization is:

ts/: *.ts files.
scripts/: compiled *.js & *.js.map & *.d.ts files.

enter image description here

NOTE: In newer versions of the compiler the correct parameter is declaration (without trailing s) and not declarations.

edited May 8, 2014 at 11:41

answered Apr 18, 2013 at 14:02

Diosney

10.6k15 gold badges70 silver badges113 bronze badges

2 Comments

JoshuaDavid Over a year ago

Great post! FYI there is an error in the screenshot. Should be: --declaration NOT --declarations (singular not plural) if you want the .d.ts file

Diosney Over a year ago

Thanks! :) You're partially right on the declarations being declaration. In older versions of the compiler was with the trailing s, but now in the newer versions is declaration. I updated the answer to reflect this.

Collectives™ on Stack Overflow

PHPStorm IDE TypeScript File Watcher

2 Answers 2

Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related