Typescript 中的 React + Firebase 云功能无法部署

Posted 2023-02-22

【中文标题】Typescript 中的 React + Firebase 云功能无法部署

【英文标题】：React + Firebase Cloud Functions in Typescript fails to deploy

【发布时间】：2020-11-24 05:16:01

【问题描述】：

我是我的项目，我想用

在 Firebase 主机上托管的 Typescript 中的 React 应用 Firestore Typescript 中的 Firebase 函数

我在部署时遇到错误。很容易重现（现在跳过 firestore 和 firebase 托管初始化）

yarn create react-app sample-app
cd sample-app
firebase init
(select functions by marking a box interactively)
(select typescript by marking a box interactively)
(uncomment in functions/src/index.ts)

functions/src/index.ts 是

import * as functions from 'firebase-functions';

// Start writing Firebase Functions
// https://firebase.google.com/docs/functions/typescript
export const helloWorld = functions.https.onRequest((request, response) => 
  functions.logger.info("Hello logs!", structuredData: true);
  response.send("Hello from Firebase!");
);

然后部署失败

firebase deploy

=== Deploying to 'myproject'...

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

> functions@ lint /Users/username/sample-app/functions
> tslint --project tsconfig.json

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

> functions@ build /Users/username/sample-app/functions
> tsc

../node_modules/@types/testing-library__react/index.d.ts:13:49 - error TS7016: Could not find a declaration file for module '@testing-library/dom'. '/Users/username/sample-app/node_modules/@testing-library/dom/dist/index.js' implicitly has an 'any' type.
  Try `npm install @types/testing-library__dom` if it exists or add a new declaration (.d.ts) file containing `declare module '@testing-library/dom';`

13 import  queries, Queries, BoundFunction  from '@testing-library/dom';
                                                   ~~~~~~~~~~~~~~~~~~~~~~

../node_modules/@types/testing-library__react/index.d.ts:16:15 - error TS7016: Could not find a declaration file for module '@testing-library/dom'. '/Users/username/sample-app/node_modules/@testing-library/dom/dist/index.js' implicitly has an 'any' type.
  Try `npm install @types/testing-library__dom` if it exists or add a new declaration (.d.ts) file containing `declare module '@testing-library/dom';`

16 export * from '@testing-library/dom';
                 ~~~~~~~~~~~~~~~~~~~~~~


Found 2 errors.

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!     /Users/username/.npm/_logs/2020-08-04T06_14_06_195Z-debug.log

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

即使在我这样做之后 npm install @types/testing-library__dom 在 root 和 functions/ 中，部署失败。

根目录有

ls
README.md     firebase.json functions     node_modules  package.json  public        src           tsconfig.json yarn.lock

欢迎任何想法。

【问题讨论】：

您能否将问题的重现推送到 git 存储库以便我们进行调试？

【参考方案1】：

如果这个解决方案适合你，你可以试试吗？

https://***.com/a/49309428/1673761

将此行添加到函数文件夹中的 tsconfig：

                                                                                       
  "compilerOptions":  
    ...
    "typeRoots": [
      "node_modules/@types",
    ],
    ...

这是为我工作的“compilerOptions”块的一部分

【讨论】：

非常感谢，您节省了我的时间。只是出于好奇，你是怎么找到它的？

不客气！当类型存在但未检测到时，通常是tsconfig.json 中的问题。在我看来，正确设置有点困难。实际上我不记得我是否在谷歌上搜索过，或者我是否在此页面右侧的相关问题中看到了链接。

谢谢！一周前我才开始写打字稿，现在我明白了，谢谢你！