Я хочу показать небольшой обзор компилятора TypeScript, TSC отвечает за составление нашего кода TypeScript, просмотра изменений, проверку кода и многое другое.
Параметры TSC принять в процессе выполнения могут прочитать конфигурацию из файла tsconfig.json.
Я объясню, как работает с компилятором по командной строке, как генерировать tsconfig.config и объяснить некоторые варианты.
Используя компилятор TSC.
Компилятор TSC преобразует код TypeScript в простой JavaScript для файла Demo Использовать app.ts с небольшим количеством строк TypeScript.
class App {
name: string;
constructor(name: string) {
this.name = name;
}
congrats(): void {
console.log(`Hello ${this.name}.`);
}
}
Затем запустите TSC из командной строки с помощью файла app.ts.
tsc app.ts
TSC принимайте код TypeScript и преобразуйте его в простой JavaScript.
"use strict";
var App = /** @class */ (function () {
function App(name) {
this.name = name;
}
App.prototype.congrats = function () {
console.log("Hello " + this.name + ".");
};
return App;
}());
Используя режим часов.
Следующий шаг, если мы изменим app.ts и должны снова собрать, но запустить TSC для каждой модификации, не является хорошей сделкой.
TSC имеет опцию для наблюдения за каждым изменением в app.ts с использованием tsc с параметрами -Варник или -W и выслушает изменения App.ts.
C:\Users\dany\Desktop\hello-typescript\app>tsc app.ts -w [3:41:21 PM] Starting compilation in watch mode... [3:41:23 PM] Found 0 errors. Watching for file changes. [3:41:44 PM] File change detected. Starting incremental compilation... [3:41:44 PM] Found 0 errors. Watching for file changes.
Режим наблюдения хорош для небольшой демонстрации или одного файла, но не для крупных проектов, потому что, если вам нужно скомпилировать более одного файла, использование командной строки не является лучшим подходом.
Как создать tsconfig.json
Компилятор TypeScript позволяет создавать файл для каждой опции, и он определен в файле TSConfig.
Когда TSC обнаружил TSConfig в каталоге, компилятор понимает, что каталог является проектом и читает определенные настройки, такие как режим наблюдения, версия JavaScript и многое другое.
TSConfig может быть сгенерировано, выполняя команду TSC -INIT и генерировать TSConfig.json по умолчанию.
C:\Users\dany\Desktop\hello-typescript\app>tsc --init message TS6071: Successfully created a tsconfig.json file.
Теперь я могу снова бежать с -Варник Опция и компилятор преобразует все файлы типографии в каталоге.
Исключить и включить файлы
Файл TSConfig имеет кучу параметров для компиляции файлов, проверки качества кода, и многое другое, есть некоторые варианты:
исключить Опция Разрешить установить список файлов, чтобы быть исключенным в процесс компиляции, а также поддерживать шаблон для исключения. По умолчанию node_modules всегда исключается, поэтому вам не нужно исключать.
exclude : [ "somefile.ts", "**/legacy/*.ts"]
Включить Это позволяет установить список файлов или шаблона, чтобы быть включенным в процесс компиляции, по умолчанию он будет принимать все файлы, возможно, вы хотите скомпилировать какой -то файл из корня приложения.
include : [ "somefile.ts", "**/legacy/*.ts"]
Компиляция
Компиляция имеет список важных настроек, очень полезных для проверки генерации кода и качества кода, существует список наиболее используемых вариантов.
цель Определить версию JavaScript будет преобразовать код TypeScript, по умолчанию ES3, но может измениться на ES6 или Esnext Анкет
Если составить app.ts С версией *es5 *и *es2015 *результат будет сильно отличаться.
Код, сгенерированный с as2015, близко к app.ts , из -за ES2015 КЛЮЧЕСКОГО СЛОВО КЛАССА.
use strict";
class App {
constructor(name) {
this.name = name;
}
congrats() {
console.log(`Hello ${this.name}.`);
}
}
Код, сгенерированный как ES5, не включает в себя класс и конструктор, потому что ES5 не понимал ключевого слова класса *класса *.
"use strict";
var App = /** @class */ (function () {
function App(name) {
this.name = name;
}
App.prototype.congrats = function () {
console.log("Hello " + this.name + ".");
};
return App;
}());
либеральный : Используется для установки библиотеки, которая будет включена в компиляцию, по умолчанию, если не установлен, она будет включать в себя библиотеку DOM, ES6 и в основном потребности в библиотеке.
щип Если установить True, компилятор будет генерировать Sourcemaps для кода TypeScript и справки для процесса отладки с браузером.
Outdir Помогите генерировать скомпилированные файлы в конкретный каталог, такой как DIST или Build. Структура файла, определенная в нашем проекте, будет такой же в каталоге Out.
noemitonerror По умолчанию компилятор всегда генерирует файлы .js, если установить True, компилятор не генерирует файлы, если обнаружил некоторую ошибку.
Строгие “ включить все ограничения по умолчанию, как нулевые чеки, строгое пропертизализация, это очень помогает полной, чтобы избежать общих ошибок.
Существительные лалокалы Установите True, и компилятор вынесет ошибку для не используемых переменных или свойств.
Существительные параметры Установить на TRUE, и компилятор вынесет ошибку в режиме разработки для параметров, не используемых в функциях
noimplicitreturns Установите на TRUE, и компилятор вызовет ошибку, когда не все пути кода в функции возвращают значение.
nofallthroughcasesinswitch Установите True, и компилятор вызовет ошибку, если корпус Switch не имеет случая по умолчанию.
смотреть Установите True и по умолчанию, TSC будет компилировать и смотреть изменения, аналогично TSC – -W.
Это некоторые варианты в TSConfig, но вы можете прочитать полную информацию в Официальная домашняя страница TypeScript
Заключите!
Это придает вам немного запуска в компиляторе TypeScript и как настроить конфигурацию TypeScript с параметрами качества кода и строгого режима.
Если вам понравился этот пост, поделитесь:).
Фотография Майкл Дзиедзич на Неспособный
Оригинал: “https://dev.to/danywalls/the-typescript-compiler-and-tsconfig-1pc6”