Параметры компиляции noEmitOnError и target

В прошлой теме было рассмотрено, что нельзя в одной области видимости несколько раз определить переменную с одним и тем же именем или что значение константы нельзя изменить.

Но давайте рассмотрим следующую небольшую программу на TypeScript:

let x = 10;
console.log(x);	// 10

var x = 20;		// ! Ошибка
console.log(x);	// Но консоль выведет 20

const t = 50;
t = 256;		// ! Ошибка
console.log(t);	// Но консоль выведет 256

При компиляции ожидаемо мы увидим ряд ошибок:

Тем не менее, если применяются настройки компиляции по умолчанию, javascript-файл вполне нормально скомпилируется, в частности, он будет иметь следующее содержание:

var x = 10;
console.log(x); // 10
var x = 20; // ! Ошибка
console.log(x); // Но консоль выведет 20
var t = 50;
t = 256; // ! Ошибка
console.log(t); // Но консоль выведет 256

И в итоге в консоли браузера мы увидим результат работы этого скрипта:

Но для компилятора TS можно с помощью параметра --noEmitOnError можно указать, что не надо генерировать файл javascript, если при компиляции возникли ошибки. Этот параметр можно указать напрямую при вызове компилятора в консоли:

tsc --noEmitOnError app.ts

Либо в файле конфигурации tsconfig.json для настройки "noEmitOnError" указать значение true:

{
    "compilerOptions": {
        "target": "es5",
        "noEmitOnError": true,
        "outFile": "app.js"
    }
}

target

Исправим предыдущий пример, чтобы он проходил компиляцию

let x = 10;
console.log(x);	// 10

var y = 20;
console.log(y);		// 20

const t = 50;
console.log(t);	// 50

При компиляции с настройками по умолчанию мы получим следующий файл javascript:

var x = 10;
console.log(x); // 10
var y = 20;
console.log(y); // 20
var t = 50;
console.log(t); // 50

Мы видим, что для определения всех значений применяется ключевое слово var, несмотря на то, что даже не самые современные браузеры уже давно поддерживают операторы let и const. Но компилятор typescript по умолчанию компилирует в стандарт ES3, для которого существует только оператор var. Но var/let/const - это частные случае. Как минимум, подавляющая часть стандарта ES2015 уже давно поддерживается во многих распространенных браузерах, свой путь прорубают новые стандарты. И если мы хотим, чтобы компилятор использовал более современный стандарт, то нам надо задать при компиляции параметр -target/-t.

Например, опять возьмем файл, который содержит ошибки:

let x = 10;
console.log(x);	// 10

var x = 120;		// ! Ошибка
console.log(x);	// Но консоль выведет 20

const t = 50;
t = 256;		// ! Ошибка
console.log(t);	// Но консоль выведет 256

Скомпилируем в стандарт "ES2015":

tsc app.ts -t ES2015

Здесь не указан параметр "noEmitOnError", поэтому компилятор сообщит об ошибках, однако файл все равно скомпилирует. Скомпилированный файл практически не будет отличаться от кода на typescript:

let x = 10;
console.log(x); // 10
var x = 120; // ! Ошибка
console.log(x); // Но консоль выведет 20
const t = 50;
t = 256; // ! Ошибка
console.log(t); // Но консоль выведет 256

Однако в браузере, который поддерживает let и const, все равно мы столкнемся с ошибкой:

Также можно задать эту настройку в файле tsconfig.json:

{
    "compilerOptions": {
        "target": "es2015",
        "noEmitOnError": true,
        "outFile": "app.js"
    }
}