Why won't Angular Firebase Cloud Functions Emulator update functions without a full deploy?

Question

I'm trying to get my development environment setup. I'm using Angular 5 TypeScript, VisualStudio IDE on a Windows 10 machine. I'm using Firebase Hosting, Firestore and Firebase Functions. I'm writing functions within the 'functions' folder in the TypeScript (index.ts) file. When following the instructions for testing Firebase Functions Locally (https://firebase.google.com/docs/functions/local-emulator). I am able to get the functions running locally both on the local server via "firebase serve" and via the Functions Shell, as described in the link. However, when I make changes to index.ts, the function is not updated when pinged again. It is only updated when I do a full "firebase deploy functions" command. That defeats the purpose of having the local Functions emulator. The idea is to avoid having to deploy the Function every-time you are changing something. Maybe, something with firebase.json? I copied it below along with the output of 'ng version'.

Angular CLI: 1.6.8
Node: 6.11.5
OS: win32 x64
Angular: 5.2.4
... cdk, common, compiler, compiler-cli, core, forms, http
... language-service, material, platform-browser
... platform-browser-dynamic, router

@angular/animations: 5.2.5
@angular/cli: 1.6.8
@angular-devkit/build-optimizer: 0.0.42
@angular-devkit/core: 0.0.29
@angular-devkit/schematics: 0.0.52
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.9.8
@schematics/angular: 0.1.17
typescript: 2.5.3
webpack: 3.10.0


// firebase.json
{
  "functions": {
    "predeploy": [
      "npm --prefix \"$RESOURCE_DIR\" run lint",
      "npm --prefix \"$RESOURCE_DIR\" run build"
    ],
    "source": "functions"
  },
  "hosting": {
    "public": "dist",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "rewrites": [
      {
        "source": "**",
        "destination": "/index.html"
      }
    ]
  },
  "database": {
    "rules": "database.rules.json"
  }
}

Answer 1

TypeScript has a transpile phase that's required to get the code into JavaScript (ES6), which can be understood by Cloud Functions. You will have to make that transpile phase happen in order for the emulator to pick up the changes.

Using the package.json that's created by the Firebase CLI for new TypeScript projects, you can run npm run build to transpile without deploying. Or you can use tsc --watch to have a process automatically transpile changes to your TypeScript.

It sounds like your package.json might be very old and doesn't include the newest npm scripts for dealing with TypeScript. I suggest re-creating it with the latest version of the Firebase CLI if you don't have npm run build available.

Also, I've written a detailed blog about this - you can read it here.