Cloud Functions Not Working for Angular Project

[formster-biz]

Trying to implement Firebase Cloud Functions in my Angular app, and getting errors, even after changing my firebase.json file per these instructions firebase/firebase-tools#822 (comment) from @laurenzlong

Version info

firebase-functions: 2.1.0

firebase-tools: 6.1.0

firebase-admin: 6.2.0

Test case

I am working in an existing Angular project already utilizing Firebase Auth, Firestore, & Storage. I am simply following the video by Doug on Firebase YouTube channel: https://youtu.be/DYfP-UIKxH0 and uncommented the helloWorld function from my index.ts file.

Steps to reproduce

After running firebase init functions, and uncommenting the helloWorld function from the index.ts file, I got errors after running firebase deploy --only functions. I changed my predeploy array in the firebase.json app from \"$RESOURCE_DIR\" to %RESOURCE_DIR%, per the instructions in this comment: firebase/firebase-tools#822 (comment)

Were you able to successfully deploy your functions?

No, I received the following errors:

kathr@KatPC MINGW64 ~/Projects/[removed-for-privacy] (master)
$ ng build

Date: 2018-11-21T00:15:59.109Z
Hash: 
Time: 13966ms
chunk {main} main.js, main.js.map (main) 129 kB [initial] [rendered]
chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 227 kB [initial] [rendered]
chunk {runtime} runtime.js, runtime.js.map (runtime) 6.22 kB [entry] [rendered]
chunk {styles} styles.js, styles.js.map (styles) 151 kB [initial] [rendered]
chunk {vendor} vendor.js, vendor.js.map (vendor) 6.09 MB [initial] [rendered]

kathr@KatPC MINGW64 ~/Projects/[removed-for-privacy] (master)
$ firebase deploy --only functions

=== Deploying to '[removed-for-privacy]'...

i  deploying functions
Running command: npm --prefix "%RESOURCE_DIR%" run lint

> functions@ lint C:\Users\kathr\Projects\[removed-for-privacy]\functions
> tslint --project tsconfig.json

Running command: npm --prefix "%RESOURCE_DIR%" run build

> functions@ build C:\Users\kathr\Projects\[removed-for-privacy]\functions
> tsc

../node_modules/@types/jquery/JQuery.d.ts(5,29): error TS2304: Cannot find name 'HTMLElement'.
../node_modules/@types/jquery/JQuery.d.ts(85,45): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQuery.d.ts(229,80): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQuery.d.ts(533,34): error TS2304: Cannot find name 'Document'.
../node_modules/@types/jquery/JQuery.d.ts(533,64): error TS2304: Cannot find name 'Document'.
../node_modules/@types/jquery/JQuery.d.ts(546,31): error TS2304: Cannot find name 'Document'.
../node_modules/@types/jquery/JQuery.d.ts(546,61): error TS2304: Cannot find name 'Document'.
../node_modules/@types/jquery/JQuery.d.ts(559,30): error TS2304: Cannot find name 'Document'.
../node_modules/@types/jquery/JQuery.d.ts(559,60): error TS2304: Cannot find name 'Document'.
../node_modules/@types/jquery/JQuery.d.ts(572,31): error TS2304: Cannot find name 'Document'.
../node_modules/@types/jquery/JQuery.d.ts(585,30): error TS2304: Cannot find name 'Document'.
../node_modules/@types/jquery/JQuery.d.ts(598,33): error TS2304: Cannot find name 'Document'.
../node_modules/@types/jquery/JQuery.d.ts(598,63): error TS2304: Cannot find name 'Document'.
../node_modules/@types/jquery/JQuery.d.ts(1021,79): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQuery.d.ts(1021,89): error TS2304: Cannot find name 'DocumentFragment'.
../node_modules/@types/jquery/JQuery.d.ts(1934,49): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQuery.d.ts(2017,59): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQuery.d.ts(2068,35): error TS2304: Cannot find name 'Text'.
../node_modules/@types/jquery/JQuery.d.ts(2068,42): error TS2304: Cannot find name 'Comment'.
../node_modules/@types/jquery/JQuery.d.ts(3986,28): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQuery.d.ts(4101,46): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQuery.d.ts(4569,38): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQuery.d.ts(5352,48): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQuery.d.ts(5568,82): error TS2304: Cannot find name 'Node'.
../node_modules/@types/jquery/JQuery.d.ts(5568,97): error TS2304: Cannot find name 'Node'.
../node_modules/@types/jquery/JQuery.d.ts(5602,83): error TS2304: Cannot find name 'Node'.
../node_modules/@types/jquery/JQuery.d.ts(5602,98): error TS2304: Cannot find name 'Node'.
../node_modules/@types/jquery/JQuery.d.ts(5822,83): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQuery.d.ts(7108,52): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQuery.d.ts(7180,75): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQuery.d.ts(8525,55): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQuery.d.ts(8693,80): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQuery.d.ts(8693,90): error TS2304: Cannot find name 'DocumentFragment'.
../node_modules/@types/jquery/JQuery.d.ts(8868,52): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQuery.d.ts(9095,35): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQuery.d.ts(9109,35): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQuery.d.ts(9295,45): error TS2304: Cannot find name 'Node'.
../node_modules/@types/jquery/JQuery.d.ts(9689,70): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQuery.d.ts(9840,86): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQuery.d.ts(12478,74): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQuery.d.ts(12629,77): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQuery.d.ts(12759,79): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQuery.d.ts(12759,152): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQueryStatic.d.ts(70,14): error TS2304: Cannot find name 'Window'.
../node_modules/@types/jquery/JQueryStatic.d.ts(101,23): error TS2304: Cannot find name 'HTMLElement'.
../node_modules/@types/jquery/JQueryStatic.d.ts(101,37): error TS2304: Cannot find name 'HTMLElement'.
../node_modules/@types/jquery/JQueryStatic.d.ts(101,102): error TS2304: Cannot find name 'Document'.
../node_modules/@types/jquery/JQueryStatic.d.ts(140,23): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQueryStatic.d.ts(140,33): error TS2304: Cannot find name 'HTMLElement'.
../node_modules/@types/jquery/JQueryStatic.d.ts(140,83): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQueryStatic.d.ts(140,93): error TS2304: Cannot find name 'Document'.
../node_modules/@types/jquery/JQueryStatic.d.ts(152,16): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQueryStatic.d.ts(165,16): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQueryStatic.d.ts(192,17): error TS2304: Cannot find name 'HTMLElement'.
../node_modules/@types/jquery/JQueryStatic.d.ts(192,48): error TS2304: Cannot find name 'Document'.
../node_modules/@types/jquery/JQueryStatic.d.ts(206,17): error TS2304: Cannot find name 'HTMLElement'.
../node_modules/@types/jquery/JQueryStatic.d.ts(328,32): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQueryStatic.d.ts(328,42): error TS2304: Cannot find name 'Document'.
../node_modules/@types/jquery/JQueryStatic.d.ts(328,53): error TS2304: Cannot find name 'Window'.
../node_modules/@types/jquery/JQueryStatic.d.ts(341,25): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQueryStatic.d.ts(341,45): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQueryStatic.d.ts(342,15): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQueryStatic.d.ts(414,81): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQueryStatic.d.ts(414,91): error TS2304: Cannot find name 'Document'.
../node_modules/@types/jquery/JQueryStatic.d.ts(414,102): error TS2304: Cannot find name 'Window'.
../node_modules/@types/jquery/JQueryStatic.d.ts(427,19): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQueryStatic.d.ts(427,29): error TS2304: Cannot find name 'Document'.
../node_modules/@types/jquery/JQueryStatic.d.ts(427,40): error TS2304: Cannot find name 'Window'.
../node_modules/@types/jquery/JQueryStatic.d.ts(475,19): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQueryStatic.d.ts(475,29): error TS2304: Cannot find name 'Document'.
../node_modules/@types/jquery/JQueryStatic.d.ts(475,40): error TS2304: Cannot find name 'Window'.
../node_modules/@types/jquery/JQueryStatic.d.ts(527,22): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQueryStatic.d.ts(1900,22): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQueryStatic.d.ts(1900,32): error TS2304: Cannot find name 'Document'.
../node_modules/@types/jquery/JQueryStatic.d.ts(1900,43): error TS2304: Cannot find name 'Window'.
../node_modules/@types/jquery/JQueryStatic.d.ts(2146,32): error TS2304: Cannot find name 'Window'.
../node_modules/@types/jquery/JQueryStatic.d.ts(2158,20): error TS2304: Cannot find name 'Node'.
../node_modules/@types/jquery/JQueryStatic.d.ts(2296,50): error TS2304: Cannot find name 'Window'.
../node_modules/@types/jquery/JQueryStatic.d.ts(2321,65): error TS2304: Cannot find name 'Window'.
../node_modules/@types/jquery/JQueryStatic.d.ts(2426,20): error TS2304: Cannot find name 'Node'.
../node_modules/@types/jquery/JQueryStatic.d.ts(2518,38): error TS2304: Cannot find name 'Document'.
../node_modules/@types/jquery/JQueryStatic.d.ts(2568,51): error TS2304: Cannot find name 'Document'.
../node_modules/@types/jquery/JQueryStatic.d.ts(2625,29): error TS2304: Cannot find name 'XMLDocument'.
../node_modules/@types/jquery/JQueryStatic.d.ts(13101,21): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQueryStatic.d.ts(13161,25): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQueryStatic.d.ts(13161,35): error TS2304: Cannot find name 'Document'.
../node_modules/@types/jquery/JQueryStatic.d.ts(13161,46): error TS2304: Cannot find name 'Window'.
../node_modules/@types/jquery/JQueryStatic.d.ts(13170,28): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQueryStatic.d.ts(13170,38): error TS2304: Cannot find name 'HTMLElement'.
../node_modules/@types/jquery/JQueryStatic.d.ts(13182,28): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQueryStatic.d.ts(13182,38): error TS2304: Cannot find name 'HTMLElement'.
../node_modules/@types/jquery/JQueryStatic.d.ts(13195,28): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQueryStatic.d.ts(13195,38): error TS2304: Cannot find name 'HTMLElement'.
../node_modules/@types/jquery/JQueryStatic.d.ts(13312,22): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/JQueryStatic.d.ts(13359,26): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/legacy.d.ts(11,64): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/legacy.d.ts(51,41): error TS2304: Cannot find name 'Event'.
../node_modules/@types/jquery/legacy.d.ts(56,20): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/legacy.d.ts(66,21): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/legacy.d.ts(91,20): error TS2304: Cannot find name 'Event'.
../node_modules/@types/jquery/legacy.d.ts(101,20): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/legacy.d.ts(121,13): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/misc.d.ts(7,17): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/misc.d.ts(7,27): error TS2304: Cannot find name 'Text'.
../node_modules/@types/jquery/misc.d.ts(7,34): error TS2304: Cannot find name 'Comment'.
../node_modules/@types/jquery/misc.d.ts(7,44): error TS2304: Cannot find name 'DocumentFragment'.
../node_modules/@types/jquery/misc.d.ts(222,21): error TS2304: Cannot find name 'XMLHttpRequest'.
../node_modules/@types/jquery/misc.d.ts(656,50): error TS2304: Cannot find name 'XMLHttpRequest'.
../node_modules/@types/jquery/misc.d.ts(676,14): error TS2304: Cannot find name 'XMLHttpRequest'.
../node_modules/@types/jquery/misc.d.ts(678,22): error TS2304: Cannot find name 'XMLHttpRequest'.
../node_modules/@types/jquery/misc.d.ts(1139,41): error TS2304: Cannot find name 'HTMLElement'.
../node_modules/@types/jquery/misc.d.ts(3987,44): error TS2304: Cannot find name 'EventTarget'.
../node_modules/@types/jquery/misc.d.ts(3987,58): error TS2304: Cannot find name 'HTMLElement'.
../node_modules/@types/jquery/misc.d.ts(3989,47): error TS2304: Cannot find name 'EventTarget'.
../node_modules/@types/jquery/misc.d.ts(3989,61): error TS2304: Cannot find name 'HTMLElement'.
../node_modules/@types/jquery/misc.d.ts(3991,48): error TS2304: Cannot find name 'EventTarget'.
../node_modules/@types/jquery/misc.d.ts(3991,62): error TS2304: Cannot find name 'HTMLElement'.
../node_modules/@types/jquery/misc.d.ts(3993,51): error TS2304: Cannot find name 'EventTarget'.
../node_modules/@types/jquery/misc.d.ts(3993,65): error TS2304: Cannot find name 'HTMLElement'.
../node_modules/@types/jquery/misc.d.ts(4014,16): error TS2304: Cannot find name 'Window'.
../node_modules/@types/jquery/misc.d.ts(4102,21): error TS2304: Cannot find name 'Element'.
../node_modules/@types/jquery/misc.d.ts(4130,26): error TS2304: Cannot find name 'TouchList'.
../node_modules/@types/jquery/misc.d.ts(4131,25): error TS2304: Cannot find name 'TouchList'.
../node_modules/@types/jquery/misc.d.ts(4132,19): error TS2304: Cannot find name 'TouchList'.
../node_modules/@types/jquery/misc.d.ts(4550,19): error TS2304: Cannot find name 'EventTarget'.
../node_modules/@types/jquery/misc.d.ts(4906,43): error TS2304: Cannot find name 'EventTarget'.
../node_modules/@types/jquery/misc.d.ts(4981,37): error TS2304: Cannot find name 'HTMLElement'.
../node_modules/@types/jquery/misc.d.ts(4986,62): error TS2304: Cannot find name 'document'.
../node_modules/@types/jquery/misc.d.ts(4993,15): error TS2304: Cannot find name 'Event'.
../node_modules/@types/sizzle/index.d.ts(14,35): error TS2304: Cannot find name 'Element'.
../node_modules/@types/sizzle/index.d.ts(14,72): error TS2304: Cannot find name 'Element'.
../node_modules/@types/sizzle/index.d.ts(14,82): error TS2304: Cannot find name 'Document'.
../node_modules/@types/sizzle/index.d.ts(14,93): error TS2304: Cannot find name 'DocumentFragment'.
../node_modules/@types/sizzle/index.d.ts(15,34): error TS2304: Cannot find name 'Element'.
../node_modules/@types/sizzle/index.d.ts(15,44): error TS2304: Cannot find name 'Document'.
../node_modules/@types/sizzle/index.d.ts(15,55): error TS2304: Cannot find name 'DocumentFragment'.
../node_modules/@types/sizzle/index.d.ts(15,74): error TS2304: Cannot find name 'Element'.
../node_modules/@types/sizzle/index.d.ts(18,28): error TS2304: Cannot find name 'Element'.
../node_modules/@types/sizzle/index.d.ts(19,41): error TS2304: Cannot find name 'Element'.
../node_modules/@types/sizzle/index.d.ts(19,53): error TS2304: Cannot find name 'Element'.
../node_modules/@types/sizzle/index.d.ts(41,48): error TS2304: Cannot find name 'Element'.
../node_modules/@types/sizzle/index.d.ts(41,58): error TS2304: Cannot find name 'Document'.
../node_modules/@types/sizzle/index.d.ts(41,85): error TS2304: Cannot find name 'Element'.
../node_modules/@types/sizzle/index.d.ts(73,20): error TS2304: Cannot find name 'Element'.
../node_modules/@types/sizzle/index.d.ts(81,24): error TS2304: Cannot find name 'Element'.
../node_modules/@types/sizzle/index.d.ts(81,68): error TS2304: Cannot find name 'Element'.
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! functions@ build: `tsc`
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the functions@ build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\kathr\AppData\Roaming\npm-cache\_logs\2018-11-21T00_16_38_729Z-debug.log

Error: functions predeploy error: Command terminated with non-zero exit code2

Expected behavior

That the newly deployed functions are active within a minute of deploying them.

Actual behavior

Received above errors.

Thanks in advance for any assistance!

(Updated this post, as I realized some of what I posted is due to actual issues and some of it was just my own misunderstanding of what was happening and I don't want to mislead anyone having the same issue that may come across this.)

[kevinajian]

@formster-biz I noticed you're using typescript. Are you compiling your code after each change before you deploy?

[formster-biz]

After much trial and error, I found that adding
"typeRoots": ["node_modules/@types"]
to "compilerOptions" in the tsconfig.json file from the functions folder resolved all errors for me.

I haven't seen this issue or solution anywhere after tons of searching. I basically just found this solution with luck and key word recognition (realized it was in my project's main tsconfig.json file but completely missing from my functions>tsconfig.json file and it had the same words as all my errors, lol). I do NOT understand at all why it works (I am very much a beginner), so if anyone could provide an actual explanation, that would be awesome! Or if this is not a good resolution and I should do something different, please let me know. Thanks!

[jspri]

Adding the typeRoots option can make typescript less strict.

It looks like you're using jQuery which is for the browser. The functions folder should just contain server side packages. If you have a super specific reason to use jQuery in your cloud functions then you can add "lib": ["dom"] to your tsconfig.

[siebmanb]

Once again the Internet saves my a**. Thank you !!!