“tsc --init”

Bhagya Mangale
3 min readApr 19, 2020

--

tsc is the TypeScript compiler and has a command line interface with plenty of available options. To initialize a TypeScript project, simply use the --init flag:

$ tsc --init.

  • We can call it a tool to initialize TypeScript and Webpack in your project.
  • It’s easy to work with TypeScript when using a starter project or a tool like the Angular CLI, but what about a simple TypeScript project that would otherwise be just a JavaScript project?

*Let’s go over some simple ways to get started.

#Dependencies

  • First, you need TypeScript installed absolutely.You can decide to have it installed globally on your machine, or locally to your project.

* To install TypeScript globally, run:

$ npm i typescript -g

*And to install locally, run:

$ npm i typescript --save-dev

#Setup

  • TypeScript comes with two binaries: ‘tsc’ and ‘tsserver’.
  • ‘tsc’ is the TypeScript compiler and has a command line interface with sufficient available options. To initialize a TypeScript project, simply use the ‘- -init’ flag.

$ tsc --init

  • If you’re using a version of TypeScript installed locally, you’ll instead want to ensure that you’re running the local version by simply using npx.

$ npx tsc --init

  • After running tsc with the ‘--init’ flag, a ‘tsconfig.json’ file will be added to your project folder with a few sensible defaults and an extensive list of commented-out possible configurations.

* Here are the starting configurations:

{
“compilerOptions”: {
“target”: “es5”,
“module”: “commonjs”,
“strict”: true
}
}

* Let’s add just two more options to that base configuration:

{
“compilerOptions”: {
“target”: “es5”,
“module”: “commonjs”,
“strict”: true,
“outDir”: “./dist/”,
“sourceMap”: true
}
}

  • With this, the JavaScript files that the TypeScript compiler outputs will be in a dist folder and sourceMaps will be generated.
  • If you don’t want sourceMaps then do not configure “sourceMap”: true.
  • With the tsconfig.json in place, we can start coding our app in TypeScript.

* Let’s create an file in a src folder with some content:

* Now, we can compile by simply running tsc:

$tsc

  • And here our JavaScript and sourceMap files are created! Here’s the content of the compiled JavaScript: /dist/demo.js
  • Instead of running the TypeScript compiler every time you make a change, you can start the compiler in watch mode instead, so that it re-compiles every time there are changes to the TypeScript files.

$ tsc -w

So this is all about ‘tsc — init’ I hope you understand this point and for more knowledge about json watch the following video.

Learn Step by Step Happily :-)

--

--