TypeScript Compiler Installation and Setup - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the command to install TypeScript globally using npm.

Typescript

npm install -g [1]

Drag options to blanks, or click blank then click option'

Anpm

Bnode

Ctypescript

Dtsc

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'node' instead of 'typescript'.

Trying to install 'tsc' directly.

Installing 'npm' which is the package manager.

The correct package to install TypeScript globally is typescript. This allows you to use the tsc command anywhere.

2fill in blank

medium

Complete the command to check the installed TypeScript compiler version.

Typescript

tsc [1]

Drag options to blanks, or click blank then click option'

A-v

B--version

C--help

D--check

Attempts:

3 left

💡 Hint

Common Mistakes

Using '--help' which shows help info, not version.

Using '--check' which is invalid.

The tsc -v or tsc --version command shows the installed TypeScript compiler version.

3fill in blank

hard

Fix the error in the command to compile a TypeScript file named app.ts.

Typescript

tsc [1]

Drag options to blanks, or click blank then click option'

Aapp.js

Bapp.json

Capp

Dapp.ts

Attempts:

3 left

💡 Hint

Common Mistakes

Trying to compile a JavaScript file.

Omitting the file extension.

Using a JSON file.

The TypeScript compiler expects the source file with the .ts extension. So app.ts is correct.

4fill in blank

hard

Fill both blanks to create a tsconfig.json file with strict type checking enabled.

Typescript

{
  "compilerOptions": {
    "strict": [1],
    "target": "[2]"
  }
}

Drag options to blanks, or click blank then click option'

Atrue

Bfalse

CES6

DES5

Attempts:

3 left

💡 Hint

Common Mistakes

Setting strict to false disables important checks.

Using ES5 target limits modern features.

Setting "strict": true enables strict type checking. The "target": "ES6" sets the JavaScript version output.

5fill in blank

hard

Fill all three blanks to compile TypeScript files in the src folder and output JavaScript files to the dist folder.

Typescript

tsc --project [1] --outDir [2] --[3]

Drag options to blanks, or click blank then click option'

Atsconfig.json

Bdist

Cwatch

Dsrc

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'src' as output directory.

Omitting the watch flag when wanting live compilation.

Not specifying the project config.

The --project tsconfig.json tells tsc to use the config file. --outDir dist sets the output folder. --watch makes the compiler watch for changes.