AWS SAM (Serverless Application Model) With Typescript

May 28, 2020

More information for SAM can be located here.

Installation for mac and linux:

sh -c "$(curl -fsSL https://raw.githubusercontent.com/Linuxbrew/install/master/install.sh)"

add to your .bash_profile

test -d ~/.linuxbrew && eval $(~/.linuxbrew/bin/brew shellenv)
test -d /home/linuxbrew/.linuxbrew && eval $(/home/linuxbrew/.linuxbrew/bin/brew shellenv)
test -r ~/.bash_profile && echo "eval \$($(brew --prefix)/bin/brew shellenv)" >>~/.bash_profile
echo "eval \$($(brew --prefix)/bin/brew shellenv)" >>~/.profile

now install tools:

brew tap aws/tap
brew install aws-sam-cli

check version:

sam --version
SAM CLI, version 0.52.0

if you need to upgrade package:

brew upgrade aws-sam-cli

start a new project:

sam init
Which template source would you like to use?
        1 - AWS Quick Start Templates
        2 - Custom Template Location
Choice: 1

Which runtime would you like to use?
        1 - nodejs12.x
        2 - python3.8
        3 - ruby2.7
        4 - go1.x
        5 - java11
        6 - dotnetcore3.1
        7 - nodejs10.x
        8 - python3.7
        9 - python3.6
        10 - python2.7
        11 - ruby2.5
        12 - java8
        13 - dotnetcore2.1
Runtime: 1

Project name [sam-app]:

Cloning app templates from https://github.com/awslabs/aws-sam-cli-app-templates.git

AWS quick start application templates:
        1 - Hello World Example
        2 - Step Functions Sample App (Stock Trader)
        3 - Quick Start: From Scratch
        4 - Quick Start: Scheduled Events
        5 - Quick Start: S3
        6 - Quick Start: SNS
        7 - Quick Start: SQS
        8 - Quick Start: Web Backend
Template selection: 1

-----------------------
Generating application:
-----------------------
Name: sam-app
Runtime: nodejs12.x
Dependency Manager: npm
Application Template: hello-world
Output Directory: .

Next steps can be found in the README file at ./sam-app/README.md

Now lets create a new npm setup:

cd sam-app
thesheff17 in ~/test/serverless/sam-app  > npm init
This utility will walk you through creating a package.json file.
It only covers the most common items, and tries to guess sensible defaults.

See `npm help json` for definitive documentation on these fields
and exactly what they do.

Use `npm install <pkg>` afterwards to install a package and
save it as a dependency in the package.json file.

Press ^C at any time to quit.
package name: (sam-app)
version: (1.0.0)
description:
entry point: (index.js)
test command:
git repository:
keywords:
author:
license: (ISC)
About to write to ~/test/serverless/sam-app/package.json:

{
  "name": "sam-app",
  "version": "1.0.0",
  "description": "This project contains source code and supporting files for a serverless application that you can deploy with the SAM CLI. It includes the following files and folders.",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}


Is this OK? (yes)
thesheff17 in ~/test/serverless/sam-app  >

Now this information comes from this site here. Now lets install some npm modules:

npm install @babel/core @babel/preset-env @types/aws-lambda babel-loader ts-loader typescript webpack webpack-cli webpack-node-externals --save-dev 
npm install source-map-support

now lets create a webpack.config.js:

const nodeExternals = require('webpack-node-externals');

module.exports = {
  devtool: "source-map",
  resolve: {
    extensions: [".js", ".ts"]
  },
  output: {
    libraryTarget: 'commonjs2'
  },
  target: "node",
  externals: [nodeExternals()],
  module: {
    rules: [
      {
        test: /\.m?js$/,
        exclude: /(node_modules|bower_components)/,
        use: {
          loader: "babel-loader",
          options: {
            presets: ["@babel/preset-env"]
          }
        }
      },
      {
        test: /\.ts?$/,
        loader: "ts-loader"
      }
    ]
  },

  mode: "development"
};

now lets add a tsconfig.json inside the hello-world folder. The below commands are inside the hello-world directory:

{
  "compilerOptions": {
    "target": "es2015",
    "module": "commonjs",
    "allowJs": true,
    "checkJs": true,
    "sourceMap": true,
    "esModuleInterop": true
  },
  "include": ["src/**/*"]
}

now lets convert project to a typescript project:

mkdir src
mv app.js src/app.ts

now lets build:

npx webpack-cli src/app.ts -c webpack.config.js -o build/app.js
npx: installed 204 in 5.951s
Hash: 76209b7084a1fc1b513b
Version: webpack 4.43.0
Time: 179ms
Built at: 05/28/2020 8:42:31 PM
 Asset      Size  Chunks             Chunk Names
app.js  1.05 KiB       0  [emitted]  main
Entrypoint main = app.js
[0] ./src/app.ts 1.02 KiB {0} [built]

You will now have a build folder with all your js scripts.

Debugging an endpoint: This requires docker to be running. Please configure before running the next command:

sam local invoke -d 5858 -e events/event.json HelloWorldFunction