Используйте Typescript со скриптом Google Apps

Question

Я хотел бы использовать Typescript для своих проектов Google Apps Script (GAS), но я не могу найти способ скомпилировать мой код в то, что принимает GAS.

GAS не поддерживает экспорт, а Typescript, похоже, не любит доступ к переменным через глобальную область (он хочет импортировать / требовать и, следовательно, экспортировать).

Я ищу любое из следующих решений, которое, я считаю, могло бы заставить меня работать:

1) Плагин Babel или тому подобное, который может удалить все операторы Import и Export вместе с их приписанными именами (требует, чтобы я не использовал те же имена методов, что и я.

Так:

import MyLibrary from './library';
export function greetJohn() { MyLibrary.greet('John'); }
export default { greetJohn }

становится:

function greetJohn() { greet('John'); }

2) Измените машинопись, чтобы она могла видеть глобальную область видимости

3) Плагин Babel или тому подобное, который объединяет все файлы.ts в один файл.js и преобразует операторы импорта / экспорта, обрабатывая каждый файл как объект / функцию.

Answer 1

Теперь можно использовать Typescript для разработки проектов скриптов Google Apps, но этого нельзя сделать непосредственно в редакторе скриптов Apps.

В соответствии с разработкой скрипта приложений с использованием TypeScript проще всего использовать застежку.

связанные с

• Включение автозаполнения для скрипта Google Apps в локально установленной IDE

Answer 2

Задний план

С тех пор, как вы написали этот вопрос, все изменилось, и в настоящее время поддержка TypeScript для разработки AppsScript улучшена. Как сказал Aliabbas Merchant, лучший способ скомпилировать TS в GAS - использовать clasp, который является инструментом CLI для разработки приложений AppsScript. Clasp использует внутреннюю библиотеку ts2gas для преобразования TS в GAS, поэтому больше нет необходимости в Webpack или любом другом сборщике только для преобразования кода в AppsScript.

Что не упомянул торговец Aliabbas, так это то, что ts2gas (пока!) Не поддерживаетexport синтаксис, который вызывает ошибки линтера при разработке и не будет хорошо принят IDE (даже при отключении линтера IDE не распознает импортированные переменные и не будет рассматривать их как ссылку на экспорт...)

Проблема

Проблема начинается с того факта, что AppsScript не использует систему модулей, и каждая определенная переменная верхнего уровня также доступна из других файлов (в отличие от TS, который "упаковывает" файлы как модули). Проблема с текущей версией ts2gas заключается в том, что она транслирует следующее утверждение:

export var x = 5;

в:

exports.x = 5

Итак, после застежки преобразует .ts к .gs, когда другой файл .gsпытается получить доступ к экспортированной переменной, но не находит ее. На самом деле, эта переменная хранится не как глобальная переменная, как ожидалось, а внутриexportsобъект (который сам по себе является глобальной переменной). Если бы мы могли каким-то образом "обмануть" компилятор, чтобы он сохранял переменную в глобальном env, даже если она также экспортируется (чтобы мы могли работать с TS без ошибок), мы бы выиграли.

Решения

Итак, мы ищем обходной путь. Вы можете найти некоторые из них в документации TS (https://github.com/google/clasp/blob/master/docs/typescript.md), но есть еще один трюк, который я нашел наиболее простым:

Определение var локально (без его экспорта), а затем экспорт объекта со всеми переменными (которые, конечно, также могут быть функциями), которые мы хотим экспортировать. TS будет вести себя как регулярный экспорт варов (это синтаксический сахар для экспорта варов), но компилятор сохранит вары как глобальные, так и внутри объекта экспорта.

пример

const a = 5;

function b() {
   return 'Hello World';
}

export {
   a,
   b
}

Таким образом, вары действительно экспортируются и могут использоваться в TS как обычно, но также останутся в глобальном env после компиляции в файлы GAS (компилятор фактически добавит их в export объект, но нам это не нужно).

Желаю, чтобы я кому-то как-то помог, и чтобы ts2gas как-то справлялся с подобными случаями на своей стороне.

Answer 3

Я изучал похожий сценарий в последние пару недель (не используя TypeScript, но все же ES6/ES7).

Некоторые из вещей, которые я нашел, могут оказаться полезными для достижения ваших целей:

• Плагин веб-пакета GAS позволяет использовать веб-пакет для загрузки модуля в GAS, определяя, когда вы назначаете глобальный объект, а затем генерируя функцию верхнего уровня, которую может запустить GAS. Это означает, что ваш импорт и экспорт будут обрабатываться веб-пакетом, поэтому вам не нужно их удалять.
• Я не смог получить import * as x from y синтаксис работать однако import { x } from y а также import x from y отлично работал при использовании веб-пакета.
• Вы можете включить свой HTML как строку в свой пакет, используя загрузчик HTML.

Если вы не хотите использовать веб-пакет, одно из решений - поместить весь код в один app.ts файл, создайте объект, содержащий все ваши функции, установите функции на верхний уровень, чтобы они могли быть подобраны GAS. Вы также можете экспортировать объект контейнера и использовать его в тестовом наборе. При компиляции с Babel используйте https://github.com/dleitee/babel-plugin-transform-remove-export, чтобы удалить оператор экспорта.

const app = {
  onInstall: () => { ...
  },
  onOpen: () => { ...
  }
}

const { onOpen, onInstall } = app;

export { app };

Answer 4

Лучший (и рекомендуемый) способ использования TypeScript с Google App Script - использовать clasp.

1. Установите застежку: npm install @google/clasp -g
2. Авторизоваться: clasp login
3. Создайте проект: clasp create [scriptTitle]
4. Необязательно: измените часовой пояс в appsscripts.jsonфайл на наиболее подходящий из этого списка.
5. Установите типы: npm i -S @types/google-apps-script
6. Создайте файл tsconfig.json:
   { "compilerOptions": { "lib": [ "esnext" ], "experimentalDecorators": true } }
7. Напишите свой код в файлах.ts
8. Отправьте свой код, используя clasp push
9. Обновите страницу скрипта и запустите свои функции.

Примечание: вам не нужно использовать import а также export. Доступ к переменным можно получить из файлов.