Настройка простого рабочего процесса, чтобы написать приложение TeamingScript Node В Live Releason (Nodemon, Ts-Node)

Этот пост является частью серии и Книга о Teamescript Отказ Он будет направлять вас с нуля для записи полных приложений TearmScript на заднем конце и переднем конце. Серия доступна как PDF EBook для бесплатно к Все Отказ

В этом посте мы узнаем, как настроить проект узла с помощью TypectScript. Он не основан на каких-либо структурах или библиотеке, таких как скрыть, экспресс, гнездо и т. Д. Допустим, вы хотите создать только приложение командной строки с помощью TeampScript и Node.

Прежде всего, вам нужно установить TypeScript на вашем компьютере. Установите это по NPM или Пряжа глобально.

npm i -g typescript

Я уверен, что вы уже установили Узел на твоем компьютере Но, возможно, вам нужно обновить вашу версию. Если это так, проверьте пост о Как установить или обновить узел с помощью NVM (диспетчер версии узла) Отказ

Хорошо, теперь давайте создадим папку проекта с именем, что вы хотите (я называю его как Узел-TS-Setup-пример ). Откройте эту папку в терминале и редактору (я использую Visual Studio Code ).

Инициализировать проект NPM команды:

npm init -y

Наш проект в качестве примера будет просто – это приложение командной строки, которое просит пользователям вводить их имя в терминале, а затем печатать приветствия с этим именем.

Давайте создадим первый файл проекта – Main.ts Отказ Просто поставь там очень базовый TeampScript код как это:

import { createInterface } from "readline";
import { promisify } from "util";

const rlInterface = createInterface({
  input: process.stdin,
  output: process.stdout,
});

const question = promisify(rlInterface.question).bind(rlInterface);

function greeting(name: unknown) {
  console.log(`Hello, ${name}!`);
}

async function main() {
  try {
    const name = await question("Type your name: ");

    greeting(name);

    rlInterface.close();
  } catch (e) {
    console.error(e);
  }
}

main();

Теперь давайте попробуем компилировать этот файл, используя компилятор Tymdercript:

tsc main.ts

Как вы, возможно, заметили, что TypectScript сообщает нам, что нам нужно установить тип объявления типа для модулей Узел что мы используем – readline. и утилизировать . Если вы не знакомы с типовыми объявлениями, проверьте пост Что такое файлы объявления типа в TypeScript? . На данный момент давайте просто устанавливаем эти объявления типа NPM :

npm install --save-dev @types/node

Попробуйте скомпилировать Main.ts опять таки:

tsc main.ts

Здорово! Файл был успешно скомпилирован. Давайте запустим это по Узел И введите наше имя, чтобы увидеть приветствия:

node main.js

Потрясающий. Но что, если нам нужно немного изменить наш код? Когда мы изменяем, что нам нужно снова компилировать этот файл и запустить его узером. Было бы здорово, если наш код будет автоматически скомпилирован и выполнен после смены. Мы можем автоматизировать процесс, запустив компилятор TypeScript в Смотреть режим :

tsc main.ts -w

Так что теперь Typeycript Compiler автоматически компилируется Main.ts в код JavaScript. Но как насчет выполнения этого? Ну, TypeScript не может выполнить код, только компилируйте его.

Мы можем настроить проект для автоматизации нашего процесса разработки. Начнем с конфигурации TeampScript. Нам нужно создать файл конфигурации Teamscript в нашем проекте. Мы можем использовать специальную команду, которая генерирует файл конфигурации с настройками по умолчанию:

tsc --init

Сгенерировал файл tsconfig.json. . Если вы откроете этот файл, вы увидите, что есть много вариантов и параметров. Я напишу об этом больше на следующих постах. Все, что нам нужно сделать, это сосредоточиться на параметрах превышать и rootdir Отказ Ратчастивая эти варианты в tsconfig.json Отказ

прертисс Это путь к папке, где будет скомпилирован из Tymdercript на код JavaScript.

rootdir Это путь к папке, где наш исходный код приложения. В нашем случае – файл Main.ts Отказ

Укажите параметры со значениями:

{
    ...
    "outDir": "./dist",
    "rootDir": "./src",
    ...
}

Также нам нужно незаспоминаться параметр модулерезолюция со значением узел :

"moduleResolution": "node", /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */

Создать папку /src. и двигаться Main.ts там.

Хорошо. Мы настроили TeampScript для нашего проекта. Теперь мы должны настроить Узел Для выполнения нашего кода в Смотреть режим.

Нам нужно установить несколько зависимостей Dev – Ts-Node и узел :

npm i -D ts-node nodemon

Ts-Node Это инструмент, который выполняет код, который написан в Teadercript, как если бы он написан в JavaScript. Я имею в виду, вы можете воспринимать это как бежать Узел Но для файлов TearmScript. Вы также можете использовать Ts-Node Как перемен, чтобы выполнить код без файлов.

Номемон это инструмент, который перезапускает приложение вашего узла при изменении некоторых файлов. Это действительно помогает в разработке, потому что вам не нужно переходить Узел Если вы измените код в своем приложении.

Теперь давайте уточним раздел Скрипты в package.json файл:

{
    ...
    "scripts": {
        "dev": "nodemon -w src src/main.ts",
        "start": "node dist/main.js",
        "build": "tsc -p ."
    },
    ...
}

Для запуска Dev Server Используйте эту команду:

npm run dev

Теперь, если мы изменим наш код в Main.ts Он автоматически повторно компилируется и повторно запустить узел для выполнения кода.

Вам нравится материал? Пожалуйста, Подписаться на мой рассылку электронной рассылки оставаться в курсе.

Оригинал: “https://dev.to/kowalevski/setup-simple-workflow-to-write-node-typescript-application-in-live-reload-3aom”