This chapter covers
- Debugging TypeScript code with the help of source maps
- The role of linters
- Compiling and bundling TypeScript apps with Webpack
- Compiling TypeScript apps with Babel
- How to compile TypeScript with Babel and bundle it with Webpack
TypeScript is one of the most loved languages. Yes, people love its syntax. But probably the main reason why it’s loved is the tooling. TypeScript developers appreciate autocompletion, those squiggly lines indicating errors as you type, and the refactoring offered by IDEs.
And the best part is that most of these features are implemented by the TypeScript team and not by IDE developers. You’ll see the same autocomplete and error messages in the online TypeScript Playground, in Visual Studio Code, or in WebStorm. When you install TypeScript, its bin directory includes two files: tsc and tsserver. The latter is the TypeScript Language Service that IDEs use to support these productivity features. When you type your TypeScript code, the IDEs communicate with tsserver, which compiles the code in memory.
With the help of source map files, you can debug your TypeScript code right in the browser. There are tools called linters; they allow you to enforce the coding styles in your organization.