Why doesn't WebStorm extract JavaScript files from TypeScript files?

Question

I use WebStorm to write Angular 4 project. I see that although I create TypeScript files and my application works fine, I don't see any JavaScript files in the project. WebStorm usually "translate" TypeScript files to JavaScript files. I don't know why it's not happening here.

Here is my settings for TypeScript:

This is my tsconfig.json:

{
  "compileOnSave": false,
  "compilerOptions": {
    "outDir": "./dist/out-tsc",
    "baseUrl": "src",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es5",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2016",
      "dom"
    ]
  }
}

If I look at the filesystem of the project, I see this:

There is no triangle next to .ts files.

However, I can see that dist folder includes some js files. Maybe it's a feature of Angular 4. It packs all TypeScript files and generates one bundled js file.

If your "application works fine" then you must have the js files in place. Webstorm will usually group together the different types of files of the same original ts file together so you'll have an entry for "index.ts" with a triangle icon on the left side. Clicking that will show you the js file and js.map file (if genererated). — Nitzan Tomer
– Nitzan Tomer, Commented May 1, 2017 at 14:14

lena · Accepted Answer · 2017-05-03 16:02:38Z

1

In your tsconfig.json, you have "compileOnSave": false. If this option is not enabled, .js files are not emitted by the built-in compiler, it's only used as a service (for error reporting, etc.). Your application is likely build by ng serve that uses webpack to compile and bundle your files, so you don't need your .js files being generated using the built-in compiler.

answered May 3, 2017 at 16:02

lena

94.4k11 gold badges154 silver badges160 bronze badges

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

Comments

Vojtech · Accepted Answer · 2017-05-01 14:12:42Z

0

It translates the TS files only when you enable it. The question is why would you want to have translated JS files in your /src? The angular app builds automatically with build tool you use.

For example with Angular CLI tool, you can build by running ng build or when developing app you can build, watch files and serve with ng serve

To answer the original question, this blog post should help you https://blog.jetbrains.com/webstorm/2016/03/how-to-compile-typescript-in-webstorm/

answered May 1, 2017 at 14:12

Vojtech

2,8243 gold badges21 silver badges29 bronze badges

Collectives™ on Stack Overflow

Why doesn't WebStorm extract JavaScript files from TypeScript files?

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related