The Twilio Serverless runtime currently does not support running TypeScript by itself but you can use the TypeScript compiler to compile your Functions ahead of time.
We published TypeScript definitions for our Serverless Runtime at @twilio-labs/serverless-runtime-types.
You can create a new Twilio Serverless project via npm init
or using the serverless plugin for the Twilio CLI. Either way you can opt to create your new project using TypeScript.
To create a new TypeScript based Twilio Serverless project with npm you can run npm init twilio-function
with the --typescript
option.
_10npm init twilio-function project-name --typescript
You can also pass the --typescript
option to the Twilio CLI serverless plugin's init
command
_10twilio serverless:init project-name --typescript
Both commands will generate a new project with a src
directory that contains your TypeScript source files. When you run npm start
or npm run deploy
the project will automatically be compiled into the dist
directory and run or deployed from there.
Start by installing the TypeScript compiler for your project using npm or another Node.js package manager:
_10# Using npm:_10npm install --save-dev typescript_10_10# Using yarn_10yarn add --dev typescript
Afterwards create your TypeScript configuration. You can do this by manually creating a tsconfig.json
in your project or by using the TypeScript compilers --init
flag.
_10# Using npm's npx command_10npx tsc --init_10_10# Using yarn_10yarn tsc_10_10# Without either_10node_modules/.bin/tsc --init
Your resulting tsconfig.json
should look something like this if you ignore the comments:
_10{_10 "compilerOptions": {_10 "target": "es5",_10 "module": "commonjs",_10 "strict": true,_10 "esModuleInterop": true _10 }_10}
We need to be able to tell TypeScript about the different types related to the Serverless Runtime. These are called TypeScript definintions and the ones for Serverless Runtime are all bundled in the @twilio-labs/serverless-runtime-types
module on npm. You'll need to install it as a dependency for your project.
_10# Using npm_10npm install @twilio-labs/serverless-runtime-types_10_10# Using yarn_10yarn add @twilio-labs/serverless-runtime-types
If you want to convert your existing Functions from JavaScript to TypeScript you'll need to:
.ts
instead of
.js
require()
statements to
import
'@twilio-labs/serverless-runtime-types';
to the top of your file
@twilio-labs/serverless-runtime-types
export const handler
instead of
exports.handler
This is how an example TypeScript version of a Twilio Function would look like.
_18// Imports global types_18import '@twilio-labs/serverless-runtime-types';_18// Fetches specific types_18import {_18 Context,_18 ServerlessCallback,_18 ServerlessFunctionSignature,_18} from '@twilio-labs/serverless-runtime-types/types';_18_18export const handler: ServerlessFunctionSignature = function(_18 context: Context,_18 event: {},_18 callback: ServerlessCallback_18) {_18 const twiml = new Twilio.twiml.VoiceResponse();_18 twiml.say('Hello World!');_18 callback(null, twiml);_18};
Since Twilio Serverless and the Toolkit don't support TypeScript out of the box yet, we need to run the compiler before the local development or deployment.
_10# Use npm_10npx tsc _10_10# Use yarn_10yarn tsc_10_10# Run the compiler directly_10./node_modules/.bin/tsc
Afterwards you can deploy the project or locally run your project.
Right now we are compiling the TypeScript files in a way that results for the JavaScript output files to live side-by-side with the TypeScript files. This is great because that means the Toolkit commands work without any additional arguments.
To move the output somewhere else, set the outDir
option of the compilerOptions
inside the tsconfig.json
file. Afterwards you'll have to call the Toolkit's start and deploy commands with the --functions-folder
flag to point again the functions/
directory inside your output directory.
Now that you know how to combine Twilio Serverless and TypeScript, why not check out some other resources to see what you can do with the Twilio Serverless Toolkit?