Why use babel-loader with ts-loader?

typescript babel-loader ts-loader
Yuriy picture Yuriy · Apr 3, 2018 · Viewed 27k times · Source

There is a TypeScript, Babel, React, and Karma Sample.

The Webpack config contains babel-loader with ts-loader for .tsx? files.

Please explain why it is needed? Why isn't ts-loader enough?

Answer

Fateme Fazli picture Fateme Fazli · Apr 3, 2018

ts-loader: convert typescript (es6) to javascript (es6)

babel-loader: converts javascript (es6) to javascript (es5) and Typescript doesn't do polyfills, which babel does. If you write client-side code in es6 and want it to run on modern browsers, you'd probably need babel's polyfills.

It is less justified with server-side code - just use the latest node version for es6 support. But babel still provides some goodies that tsc doesn't - like caching, or a huge range of plugins that can be very useful.

It's not necessary but a practice for using them all together.

Related questions

How to convert a string to number in TypeScript?

Given a string representation of a number, how can I convert it to number type in TypeScript? var numberString: string = "1234"; var numberValue: number = /* what should I do with `numberString`? */;

Read More
Can't bind to 'ngModel' since it isn't a known property of 'input'

I've got the following error when launching my Angular app, even if the component is not displayed. I have to comment out the <input> so that my app works. zone.js:461 Unhandled Promise rejection: Template parse errors: Can't …

Read More
Can't bind to 'formGroup' since it isn't a known property of 'form'

THE SITUATION: Please help! I am trying to make what should be a very simple form in my Angular2 app but no matter what it never works. ANGULAR VERSION: Angular 2.0.0 Rc5 THE ERROR: Can't bind to 'formGroup' since it isn't …

Read More