typescript.md

Typescript

This guide is an example of how to develop a function in Typescript with the Functions Framework.

1. Use gts to configure Typescript.

   npx gts init

2. Install the required packages:

   npm install @openfunction/functions-framework
   npm install @types/express concurrently nodemon --save-dev

3. Add a start script to package.json, passing in the --source flag to point to the compiled code directory (configured by gts in this example). Also add a watch script to use for development:

     "scripts": {
       "start": "functions-framework --source=build/src/ --target=helloWorld",
       "watch": "concurrently \"tsc -w\" \"nodemon --watch ./build/ --exec npm run start\"",
       ...
     }

4. Replace the contents of src/index.ts with:

   import type { HttpFunction } from '@openfunction/functions-framework/build/src/functions';
   
   export const helloWorld: HttpFunction = (req, res) => {
     res.send('Hello, World');
   };

5. Start the built-in local development server in watch mode:

   npm run watch

   This will continuously watch changes to your TypeScript project and recompile when changes are detected:

   [12:34:56 AM] Starting compilation in watch mode...
   [12:34:57 AM] Found 0 errors. Watching for file changes.
   ...
   Serving function...
   Function: helloWorld
   URL: http://localhost:8080/

Deploying with gcloud CLI

1. Adjust main field in package.json to point to the compiled javascript source.

     "main": "build/src/index.js",
     ...

2. Remove prepare script in package.json created by gts. This is because the prepare script requires typescript to be installed and will cause the function to fail to deploy if not removed.

3. Deploy:

   gcloud functions deploy helloWorld \
   --runtime nodejs16 \
   --trigger-http