Имея дело с GAS в Web app часто приходится работать в связке с html.
Делать данную работу во встроенном Script editor в части тегов не всегда удобно.
Однако, этой проблемы можно избежать, если настроить скрипты в Visual studio
Что понадобится?
- Visual code — https://code.visualstudio.com/
2. Node js — https://nodejs.org/en/
3. Clasp — https://github.com/google/clasp
Приступаем
Ставим Vs Code и Node JS
После заходим в Vs Code и убеждаемся, что Node JS встал без ошибок
Для этого заходим в терминал
и пишем node -v
если все успешно, то система покажет текущую версию Node JS
Затем устанавливаем clasp — npm install -g @google/clasp
в результате получаем следующее:
проверяем, успешно ли встал clasp — clasp -v
на данном этапе у вас может появиться ошибка прав и терминал засверкает красными буквами.
Лечится это просто.
Открывается power shell от имени администратора и в ней пишется Set-ExecutionPolicy RemoteSigned
(через обычную cmd это не работает, запускать надо именно PowerShell)
и пишем ответом А
после этого clasp -v в терминале Vs Code ошибок выдавать не будет
Далее переходим в гугл — https://script.google.com/home/usersettings
и включаем API скриптов
Возвращаемся в терминал VS Code и пишем clasp login,
даём все разрешения, которые запросит гугл.
После успешного разрешения в браузере появится
Далее возвращаемся в Vs Code и создаём отдельную папку под код
Клонируем скрипт
Для того, чтобы получить локальную копию скрипта нужно клонировать его по ID
ID скрипта можно получить здесь:
пишем все в том же терминале:
npm init, который создает файл package.json
и
clasp clone «1yEgj9wiKzCe8ILLQAPhY5jgeKW1mWJWyt7V2J3Zs9SvtVEWsdXMIBJLS» —rootDir src
где в кавычках — ID скрипта, а —rootDir src — куда его копировать
В результате в папке src получаем тот же самый гугл скрипт, что и на сети
Пишем и обновляем код
Возьмём любой код клонированного скрипта, например:
или он же в Vs Code:
и допишем в него ещё одну функцию
Так как эти изменения коснулись лишь локальной версии скрипта, на сети все осталось прежним.
Чтобы обновить скрипт на сети надо сделать clasp push в терминале, поймав следующее
однако, ничего создавать или клонировать не надо
файл .clasp.json есть в папке src
откуда его надо перетянуть в корневой каталог
после чего снова сделать clasp push в терминале
Вот и всё! Теперь мы получили обновлённую версию скрипта и на сети
Ну и напоследок… делаем автозаполнение в VS Code
Идём сюда — https://github.com/google/clasp/blob/master/docs/typescript.md
и находим строчку
- Install TypeScript definitions for Apps Script in your project’s folder.
npm i -S @types/google-apps-script
запускаем ее в терминале VS Code и теперь он умеет дозаполнять методы
Ваше мнение важно и может улучшить блог
Я хочу услышать ваше мнение и ваши идеи о том, как сделать этот сайт еще лучше. Примите участие в опросе, чтобы поделиться вашими пожеланиями, предложениями и замечаниями. Пройдите опрос сейчас и помогите сделать этот сайт более полезным для вас!
Привет!
Спасибо.
Заметил, что в гугл редакторе видны методы из всех файлов.
А в VSCode не виден код из соседних файлов.
Что делать?
Добрый день!
Можно подетальнее?
Я правильно понимаю, что Вы о том, что в гугл редакторе в любом скрипте виден весь набор доступных методов gas, классов и тд?
А при работе в вс коде у вас этого авто(до)заполнения нет?
Если так, то как и писал выше, в вс коде надо установить пакет — npm i -S @types/google-apps-script