Develop Apps Script using TypeScript

TypeScript is a typed superset of JavaScript that can compile to plain Apps Script. When you use TypeScript in the development of an Apps Script project, you gain the following benefits:

• Local IDE autocomplete
• Optional structural typing
• Type inference, interfaces
• ES6 features such as classes and arrow functions.

This guide covers some common tasks for developing an Apps Script project with TypeScript.

Note: See clasp's GitHub TypeScript guide for the latest TypeScript guide.

Requirements

If you are unfamiliar with TypeScript, review the TypeScript documentation and TypeScript quickstart to familarize yourself with the basic concepts prior to attempting any of the procedures described in this guide.

The following tools are required in order to use TypeScript in Apps Script projects with clasp. While using clasp is not strictly needed to enable TypeScript use in Apps Script, it is strongly recommended as it simplifies the procedures greatly.

Before attempting any of the processes described below, be sure you have installed the following to enable your local development environment:

• Node and npm
• clasp: npm install -g @google/clasp
• Type definitions for Apps Script: npm i -S @types/google-apps-script
• Visual Studio Code (for TypeScript IDE autocompletion)

Be sure to familiarize yourself with the clasp documentation if you have not used clasp previously.

Using TypeScript in a Clasp Project

You can use clasp to quickly create a new local Apps Script project. This command creates an appsscript.json and Code.gs, the base of an Apps Script project.

To use TypeScript in an App Script file, simply rename the file extension from gs to ts.

Edit local TypeScript files

Using your preferred editor, you can write local TypeScript files as .ts files in project's folder.

Note: Existing .gs/.js files can be upgraded to .ts files by renaming the file extension. TypeScript and ES6 features can be added incrementally to existing files.

For example, a file named index.ts could have the following TypeScript code:

const greeter = (person: string) => {
  return `Hello, ${person}!`;
}

let user = 'Grant';
Logger.log(greeter(user));

You can write TypeScript with ES6+ features such as arrow functions and string interpolation (${var}). These files are transpiled into Apps Script constructs when you push the project to the Apps Script server.

Upload a local Apps Script project that uses TypeScript

When you are finished editing the local TypeScript and Apps Script files, you can upload the local files to Google Drive using the following clasp command:

clasp push --watch

This command watches for TypeScript file changes and uses typescript to compile the code and clasp to upload the project to Google Drive.

Report issues or file feature request

If you encounter an issue with the clasp tool, you can report it on GitHub.

If you encounter a problem or bug with TypeScript itself, you can report it in TypeScript's GitHub repository.

Related reading

• Learn TypeScript in 5 minutes
• TypeScript Handbook
• TSLint