Node — это среда исполнения, позволяющая писать серверный код JavaScript. Она получила очень широкое распространение после своего выпуска в 2011 году. С ростом базы кода написание серверного кода JavaScript может представлять сложности в связи с характером языка JavaScript: динамичным и слабо типизированным.
Разработчики, переходящие на JavaScript с других языков, часто жалуются на отсутствие мощного статического типирования, но TypeScript позволяет устранить этот недостаток.
TypeScript — это типовой (опциональный) супернабор JavaScript, который может помочь со сборкой и управлением крупномасштабными проектами JavaScript. Его можно представить как JavaScript с дополнительными возможностями, включая мощное статическое типирование, компиляцию и объектно-ориентированное программирование.
Примечание. С технической точки зрения TypeScript является супернабором JavaScript, и это означает, что весь код JavaScript является корректным кодом TypeScript.
Перечислим некоторые преимущества использования TypeScript:
В этом учебном модуле вы настроите проект Node с помощью TypeScript. Вы создадите приложение Express с помощью TypeScript и преобразуете его в компактный и надежный код JavaScript.
Перед началом прохождения этого модуля вам нужно будет установить Node.js на вашем компьютере. Для этого можно выполнить указания руководства Установка Node.js и создание локальной среды разработки для вашей операционной системы.
Для начала создайте новую папку с именем node_project
и перейдите в этот каталог.
- mkdir node_project
- cd node_project
Затем инициализируйте его как проект npm:
- npm init
После запуска npm init
вам нужно будет передать npm информацию о вашем проекте. Если вы разрешите npm принимать ощутимые значения по умолчанию, вы можете добавить флаг y
, чтобы пропустить диалоги с запросом дополнительной информации:
- npm init -y
Теперь пространство вашего проекта настроено, и вы можете перейти к установке необходимых зависимостей.
Следующий шаг после инициализации базового проекта npm — установить зависимости, требующиеся для запуска TypeScript.
Запустите следующие команды из каталога вашего проекта для установки зависимостей:
- npm install -D typescript@3.3.3
- npm install -D tslint@5.12.1
Флаг -D
— сокращенное обозначение опции: --save-dev
. Более подробную информацию об этом флаге можно найти в документации npmjs.
Пришло время установить платформу Express:
- npm install -S express@4.16.4
- npm install -D @types/express@4.16.1
Вторая команда устанавливает типы Express для поддержки TypeScript. Типы в TypeScript — это файлы, которые обычно имеют расширение .d.ts
. Файлы используются для предоставления типовой информации об API, в данном случае структуры Express.
Этот пакет требуется, потому что TypeScript и Express являются независимыми пакетами. Без пакета @types/express
у TypeScript нет способа узнавать типы классов Express.
В этом разделе мы настроим TypeScript и проверку соблюдения стандартов для TypeScript. TypeScript использует файл tsconfig.json
для настройки опций компилятора для проекта. Создайте файл tsconfig.json
в корне каталога проекта и вставьте следующий фрагмент кода:
{
"compilerOptions": {
"module": "commonjs",
"esModuleInterop": true,
"target": "es6",
"moduleResolution": "node",
"sourceMap": true,
"outDir": "dist"
},
"lib": ["es2015"]
}
Давайте рассмотрим некоторые ключи во фрагменте кода JSON выше:
module
: указывает метод генерирования кода модуля. Node использует commonjs
.target
: указывает уровень языка на выходе.moduleResolution
: помогает компилятору определить, на что ссылается импорт. Значение node
имитирует механизм разрешения модуля Node.outDir
: Это место для вывода файлов .js
после транспиляции. В этом учебном модуле мы сохраним его как dist
.В качестве альтернативы созданию и заполнения файла tsconfig.json
вручную можно запустить следующую команду:
- tsc --init
Эта команда сгенерирует файл tsconfig.json
с правильными комментариями.
Чтобы узнать больше о доступных опциях ключ-значение, можно использовать официальную документацию TypeScript, где приводятся разъяснения всех опций.
Теперь вы можете настроить проверку соответствия стандартам кода TypeScript для этого проекта. Откройте в терминале корневой каталог вашего проекта, который установлен в этом учебном модуле как node_project
, и запустите следующую команду для генерирования файла tslint.json
:
- ./node_modules/.bin/tslint --init
Откройте сгенерированный файл tslint.json
и добавьте соответствующее правило no-console
:
{
"defaultSeverity": "error",
"extends": ["tslint:recommended"],
"jsRules": {},
"rules": {
"no-console": false
},
"rulesDirectory": []
}
По умолчанию модуль проверки TypeScript предотвращает использование отладки через команды консоли
, поэтому нужно явно предписать ему отключить правило по умолчанию no-console
.
package.json
Сейчас вы можете запускать функции в терминале по отдельности или создать скрипт npm для их запуска.
На этом шаге мы создадим скрипт start
, который выполнит компиляцию и транспиляцию кода TypeScript, а затем запустит полученное приложение .js
.
Откройте файл package.json
и обновите его соответствующим образом:
{
"name": "node-with-ts",
"version": "1.0.0",
"description": "",
"main": "dist/app.js",
"scripts": {
"start": "tsc && node dist/app.js",
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"devDependencies": {
"@types/express": "^4.16.1",
"tslint": "^5.12.1",
"typescript": "^3.3.3"
},
"dependencies": {
"express": "^4.16.4"
}
}
В приведенном выше фрагменте кода мы обновили путь main
и добавили команду start
в раздел scripts. Если посмотреть на команду start
, вы увидите, что вначале запускается команда tsc
, а затем — команда node
. При этом будет проведена компиляция, и сгенерированный вывод будет запущен с помощью node
.
Команда tsc
предписывает TypeScript скомпилировать приложение и поместить сгенерированный вывод .js
в указанном каталоге outDir
, как указано в файле tsconfig.json
.
Теперь TypeScript и модуль проверки настроены, и мы можем приступить к сборке модуля Node Express Server.
Вначале создайте папку src
в корневом каталоге вашего проекта:
- mkdir src
Затем создайте файл с именем app.ts
:
- touch src/app.ts
На этом этапе структура каталогов должна выглядеть следующим образом:
├── node_modules/
├── src/
├── app.ts
├── package-lock.json
├── package.json
├── tsconfig.json
├── tslint.json
Откройте файл app.ts
в предпочитаемом текстовом редакторе и вставьте следующий фрагмент кода:
import express from 'express';
const app = express();
const port = 3000;
app.get('/', (req, res) => {
res.send('The sedulous hyena ate the antelope!');
});
app.listen(port, err => {
if (err) {
return console.error(err);
}
return console.log(`server is listening on ${port}`);
});
Приведенный выше код создает сервер Node, прослушивающий порт 3000
на предмет запросов. Запустите приложение с помощью следующей команды:
- npm start
При успешном выполнении сообщение будет зарегистрировано на терминале:
- Outputserver is listening on 3000
Теперь вы можете открыть в браузере адрес http://localhost:3000
и увидите следующее сообщение:
- OutputThe sedulous hyena ate the antelope!
Откройте файл dist/app.js
, и вы найдете в нем транспилированную версию кода TypeScript:
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const express_1 = __importDefault(require("express"));
const app = express_1.default();
const port = 3000;
app.get('/', (req, res) => {
res.send('The sedulous hyena ate the antelope!');
});
app.listen(port, err => {
if (err) {
return console.error(err);
}
return console.log(`server is listening on ${port}`);
});
//# sourceMappingURL=app.js.map
Вы успешно настроили проект Node для использования TypeScript.
В этом учебном модуле вы узнали, почему TypeScript полезен для написания надежного кода JavaScript. Также вы узнали о некоторых преимуществах работы с TypeScript.
Наконец, вы настроили проект Node с использованием структуры Express, но скомпилировали и запустили проект с помощью TypeScript.
Thanks for learning with the DigitalOcean Community. Check out our offerings for compute, storage, networking, and managed databases.
This textbox defaults to using Markdown to format your answer.
You can type !ref in this text area to quickly search our full set of tutorials, documentation & marketplace offerings and insert the link!