Переход с Javascript на Typescript — Лайфхаки

Я хочу поделиться с вами некоторыми потенциально полезными лайфхаками и решениями, которые я курировал на пути миграции наших сервисов Javascript на Typescript.

Смешанные файлы .js и .ts

После того, как вы, вероятно, добавили tsconfig.json в корень вашего проекта, ваш проект начнется со смешанных файлов .ts и .js, поэтому поддержка этой комбинации гарантирует, что вы добавили эти поля:

"allowJs": true,  
"esModuleInterop": true

Поддержка глобальных переменных

В вашей кодовой базе javascript нередко можно обнаружить использование переменных, которые никогда не были определены в файле, и, скорее всего, вы получите TSERROR, если эта переменная не определена. Таким образом, чтобы сообщить транспилятору машинописного текста, что эти переменные существуют и он должен нам «доверять», мы можем добавить файл где-нибудь в наши исходные файлы, например, с именем example globals.d.ts, содержащий:

export declare global {  
 var logger: any;  
 var models: any  
}  
  
export declare namespace NodeJS {  
  interface Global {  
  logger: any;  
  models: any  
  }  
}

Импорт файла .js из файла .ts

При попытке импортировать файл Javascript, скажем, example.js, из файла Typescript, не тривиально, что эта комбинация будет работать из коробки.
Один из вариантов сделать это — использовать обычный импорт старых узлов:
const example = require('./example')
И это сработает!
Но допустим, мы хотим, чтобы наш код был чистым и соответствовал стандартам Typescript, и использовал стиль экспорта/импорта, например:
import example from “example”
К сожалению, это неожиданно не сработало, вы верите?< br /> Что происходит, и я избавлю вас от надоедливых исследований, так это то, что этот код транспилируется в это:
const example = require('example').default
и, поскольку example.js написан на чистом Javascript, он был транспилирован, и поэтому нет{default: MODULE} оболочка создается в выходном файле example.js .

Что мы можем сделать, чтобы решить эту проблему?
import * as Example from “example”;
Этот синтаксис обходит ожидаемый require('example').default и просто заключает все, что экспортирует модуль, в объект Example.

ts-узел

Пока вы пишете машинописный код узла, вы можете запустить свой проект непосредственно в машинописном тексте, а не запускать tsc, а затем запускать полученный файл .js.
ts-node делает именно это! вы можете сказать свое слово, index.ts , непосредственно с помощью
ts-node index.ts . Вы также можете просто запустить команду ts-node и использовать ее Typescript REPL, что очень полезно для тестирования.
Одно небольшое предостережение: если вы хотите, чтобы ts-node использовал ближайший tsconfig.json, что очень важно, поскольку некоторая конфигурация подходит идеально подходит для вашего проекта, но конфигурация ts-node по умолчанию может вызвать некоторые ошибки, которые могут вас запутать. Поэтому убедитесь, что вы добавили это в свой файл tsconfig.json:

"ts-node": {
  "files": true
}