💻 Ориентируйтесь на время выполнения вашего узла!

📑 Содержание

Это часть 1 компиляции вашей облачной функции для кода Firebase. Мы будем исследовать компиляцию для целей Node с babel и tsc.

Априорная теория:

📚 Облачные функции для Firebase со скомпилированным кодом
ES6, ES7, Flow, TypeScript, Babel и ParcelJS
📚 Babel и preset-env
Компиляция для сред, а не для спецификаций

💻 Часть 2: Облачные функции для Firebase с Flow, TypeScript и ReasonML через ParcelJS

Структура папок и TL; DR

Единственные различия между примерами:

  • <config file> используется для выбранного вами инструмента. Здесь будет определена цель Node для Babel и TypeScript.
  • src/index.<ext> файл. Это точка входа для любого инструмента, компилирующего ваш код.
  • package.json scripts и devDependencies.

Такой же

Следующие файлы должны оставаться неизменными во всех примерах:

.firebaserc - сообщит firebase-tools, в какой проект Firebase следует развернуть.

firebase.json - определяет папку для развертывания. В этом случае мы развернем корневую папку

{
  "functions": {
    "source": "."
  }
}

Примечание: firebase-tools будет игнорировать node_modules при загрузке, поскольку Cloud Functions сама устанавливает зависимости в облаке 💯 Что будет развернуто:

  • dist/ для скомпилированного кода
  • src/ для исходного кода, включающего исходные карты с журналами облачных функций.
  • package.json по причинам, описанным ниже.

package.json - определяет наши:

  • скрипты - основные скрипты будут называться watch, serve & deploy. Скрипт compile запускает инструмент компиляции. В идеале, компиляция нашего кода тоже с исходными картами.
"compile": "",
"watch": "",
"serve": "",
"predeploy": "yarn compile",
"deploy": "yarn firebase deploy --only functions"
  • dependencies - необходимость установки облачных функций в облаке.
  • main - это самая важная из всех сфер. Это определяет точку входа в ваш код, которую будут выполнять облачные функции. Поскольку мы загружаем корневую папку, наша точка входа находится по адресу:
{
  "main": "dist/index.js"
}

Обратите внимание dist/, а не src/. Поскольку это всегда .js файл, он останется неизменным для разных инструментов.

Мы будем ориентироваться на среду выполнения Node 6 по умолчанию с этими примерами по причинам, обсуждаемым позже.

Разные

Теперь у нас есть план нашей структуры, давайте заполним отверстия для различных инструментов:

Вавилон

Я писал о Babel в прошлом, прочтите, если вы незнакомы (ссылки вверху этого сообщения).

Наша конфигурация будет .babelrc файлом:

{ "presets": [
  [
    "@babel/preset-env", {
      "targets": {
        "node": "6.14.0"
      }
    }
  ]
]}

DevDependencies:

yarn add \
  @babel/cli \
  @babel/core \
  @babel/preset-env \
  firebase-tools -D

Наши скрипты будут использовать @babel/cli и нашу .babelrc конфигурацию для компиляции нашего кода:

"compile": "babel 'src' --out-dir 'dist' --source-maps",
"watch": "yarn compile --watch",
"serve": "yarn watch & yarn firebase serve --only functions",
"predeploy": "yarn compile",
"deploy": "yarn firebase deploy --only functions"

Поток с Babel

К сожалению, firebase-functions в настоящее время не имеет типов Flow (см. Flow-typed) и, как инструмент, похоже, уступает место TypeScript. Грустный.

Простое добавление @babel/preset-flow к предыдущему примеру Babel позволит нам использовать Flow. Наш .babelrc файл:

{ "presets": [
  [
    "@babel/preset-env", {
      "targets": {
        "node": "6.14.0"
      }
    }
  ],
  ["@babel/preset-flow"]
]}

DevDependencies:

yarn add @babel/preset-flow

Наши скрипты останутся прежними.

Машинопись

Веб-SDK Firebase пишутся на TypeScript, поэтому здесь есть много преимуществ. Наша конфигурация будет tsconfig.json файлом:

{
  "compilerOptions": {
    "lib": ["es6"],
    "module": "commonjs",
    "noImplicitReturns": true,
    "outDir": "dist",
    "sourceMap": true,
    "target": "es6"
  },
  "compileOnSave": true,
  "include": ["src"]
}

TS не поддерживает таргетинг на версию NodeJS, только на версии ECMAScript. Мы укажем es6, поскольку он работает на Node 6.14.0.

DevDependencies:

yarn add \
  @firebase/app-types \
  firebase-tools \
  typescript -D

Наши package.json скрипты:

"compile": "yarn tsc",
"serve": "yarn compile && yarn firebase serve --only functions",
"predeploy": "yarn compile",
"deploy": "yarn firebase deploy --only functions"

tsc не поддерживает просмотр файлов "из коробки", для этого вам понадобится tsc-watch или проверить мой следующий пост с помощью ParcelJS.

Примечание об установке времени выполнения облачных функций

На момент написания Firebase по умолчанию ориентирована на среду выполнения Node 6. Чтобы настроить таргетинг на узел 8, вы должны указать "engines": {"node": "8"} в вашем package.json. Добавление этого поля вызывает множество проблем с инструментами, поскольку это точный номер версии, а не диапазон SemVer.

Например, используя Node 10.13.0 (самый последний LTS) и поле engines, установленное на определенное число, вы столкнетесь с этой ошибкой:

The engine "node" is incompatible with this module. Expected version "8". Got "10.13.0"

К сожалению, firebase-tools ожидает одно из этих:

{"node": "6"} // or
{"node": "8"}

Таким образом, настоятельно рекомендуется использовать либо Node 6 LTS, либо Node 8 LTS в качестве локальной версии Node для разработки с продуктами Firebase.

Взгляните на мой репозиторий firebase-examples для примера кода:



jthegedus / firebase-gcp-examples
🔥 Примеры Firebase и GCP, исследующие бессерверные архитектуры приложений, языки, инструменты и многое другое! … github.com



Заключение

По возможности скомпилируйте точное время выполнения вашей среды. Babel - САМЫЙ инструмент для этого в JavaScript. Flow отлично подходит (мой любимый) для набора текста и прост в настройке, если у вас уже есть рабочий процесс Babel. Выявление типов в Flow избавит вас от написания типов повсюду, чтобы получить хорошее покрытие, однако кажется, что сообщество JS выбирает TypeScript для типов, так что вам может быть лучше использовать TS, это зависит от вас.

Во второй части мы рассмотрим использование сборщика, а именно ParcelJS, для компиляции нашего кода и обеспечения более согласованного взаимодействия с разработчиком.

Хотите еще что-нибудь почитать?

Еще я:

📑 Содержание
Индекс для моей серии Medium

💬 Состояние Firebase (конец 2018 г.)
Выпуски и улучшения за 2018 г.

Если вы нашли это полезным, порекомендуйте и поделитесь с друзьями и коллегами.