Используйте TypeScript для облачных функций

Для разработчиков, которые предпочитают писать функции на TypeScript, Cloud Functions предоставляет два типа поддержки:

  • Создавайте и настраивайте проекты TypeScript для автоматической транспиляции при инициализации ( firebase init functions ).
  • Транспилируйте существующий исходный код TypeScript в JavaScript во время развертывания с помощью перехватчика предварительного развертывания .

Следуя инструкциям в этом руководстве, вы можете перенести существующий проект JavaScript на TypeScript и продолжить развертывание функций с помощью перехватчика предварительного развертывания для переноса исходного кода. TypeScript предлагает множество преимуществ по сравнению с ванильным JavaScript при написании функций:

  • TypeScript поддерживает новейшие функции JavaScript, такие как async/await, что упрощает управление обещаниями.
  • Линтер Cloud Functions выявляет распространенные проблемы во время написания кода.
  • Безопасность типов помогает избежать ошибок во время выполнения развернутых функций.

Если вы новичок в TypeScript, см. статью TypeScript за 5 минут .

Инициализация нового проекта Cloud Functions с помощью TypeScript

Запустите firebase init functions в новом каталоге. Инструмент дает вам возможность создать проект с помощью JavaScript или TypeScript. Выберите TypeScript , чтобы вывести следующую структуру проекта:

myproject
 +- functions/     # Directory containing all your functions code
      |
      +- package.json  # npm package file describing your Cloud Functions code
      |
      +- tsconfig.json
      |
      +- .eslintrc.js # Optional file if you enabled ESLint
      +- tsconfig.dev.json # Optional file that references .eslintrc.js
      |
      +- src/     # Directory containing TypeScript source
      |   |
      |   +- index.ts  # main source file for your Cloud Functions code
      |
      +- lib/
          |
          +- index.js  # Built/transpiled JavaScript code
          |
          +- index.js.map # Source map for debugging

После завершения инициализации раскомментируйте образец в index.ts и запустите npm run serve чтобы увидеть функцию «Hello World» в действии.

Использование существующего проекта TypeScript

Если у вас есть существующий проект TypeScript, вы можете добавить перехватчик предварительного развертывания, чтобы гарантировать, что ваш проект будет пересылаться каждый раз, когда вы развертываете свой код в Cloud Functions for Firebase . Вам понадобится правильно сформированный файл tsconfig.json и проект Firebase, а также внести следующие изменения в конфигурацию Firebase:

  1. Отредактируйте package.json , добавив скрипт bash для создания проекта TypeScript. Например:

     {
   "name": "functions",
   "scripts": {
     "build": "npm run lint && tsc"
   }
 ...

  2. Отредактируйте firebase.json , добавив ловушку предварительного развертывания для запуска сценария сборки. Например:

     {
   "functions": {
     "predeploy": "npm --prefix functions run build",
   }
 }

В этой конфигурации команда firebase deploy --only functions создает ваш код TypeScript и развертывает его как функции.

Миграция существующего проекта JavaScript на TypeScript

Если у вас есть проект Cloud Functions , который вы инициализировали и разработали на JavaScript, вы можете перенести его на TypeScript. Перед началом работы настоятельно рекомендуется создать контрольную точку git или другую резервную копию.

Чтобы перенести существующий проект Cloud Functions JavaScript:

  1. Создайте контрольную точку git и сохраните копии существующих исходных файлов JavaScript.
  2. В каталоге проекта запустите firebase init functions и выберите TypeScript , когда будет предложено указать язык для написания функций.
  3. Когда будет предложено перезаписать существующий файл package.json , выберите «Нет» , если вы не уверены, что не хотите сохранять существующий файл.
  4. Удалите index.ts в каталоге functions/src , заменив его существующим исходным кодом.
  5. В файле tsconfig.json , созданном при инициализации, установите параметры компилятора, разрешающие JavaScript: "allowJs": true .
  6. Скопируйте сохраненный файл package.json в каталог functions и отредактируйте его, установив для "main" значение "lib/index.js" .

  7. Также в package.json добавьте скрипт сборки для TypeScript, например:

     {
   "name": "functions",
   "scripts": {
     "build": "npm run lint && tsc"
   }
 ...

  8. Добавьте "typescript" в качестве зависимости разработчика, запустив npm install --save-dev typescript @typescript-eslint/eslint-plugin @typescript-eslint/parser .

  9. Для всех зависимостей запустите npm install --save @types/<dependency> .

  10. Перепишите исходный код из .js в .ts по желанию.

Эмуляция функций TypeScript

Чтобы протестировать функции TypeScript локально, вы можете использовать инструменты эмуляции, описанные в разделе «Локальный запуск функций» . Перед использованием этих инструментов важно скомпилировать код, поэтому обязательно запустите npm run build внутри каталога функций перед запуском firebase emulators:start или firebase functions:shell . Альтернативно, запустите npm run serve или npm run shell в качестве ярлыка; эти команды одновременно запускают сборку и обслуживают/запускают оболочку функций.

Журналы функций для проектов TypeScript

Во время firebase deploy index.ts вашего проекта переносится в index.js . Это означает, что журнал облачных функций будет выводить номера строк из файла index.js , а не из написанного вами кода. Чтобы вам было проще найти соответствующие пути и номера строк в index.ts , firebase deploy создает functions/lib/index.js.map . Вы можете использовать эту исходную карту в предпочитаемой вами IDE или через модуль узла .