Firebase云函数开发中TypeScript代码出现--jsx参数解析错误

这个报错和你写的Firebase云函数业务代码、贴出的tsconfig.json本身没有直接冲突，本质是项目里的@typescript-eslint/parser（ESLint的TypeScript语法解析器）的配置不符合新版包的校验规则。
新版的typescript-eslint解析器强制要求jsx配置项必须是preserve/react-native/react三个合法值之一，如果你没有显式给这个参数赋值，解析器就会在刚读取文件第一行时抛出解析错误。正因为解析是从文件开头启动的，报错才会恰好标在最上方的import语句下方，给人一种导入的firebase-functions包有问题的错觉。
很多早期Firebase教程能正常跑，是因为教程发布时对应的解析器版本还没有加入这一项强制校验，现在安装依赖时拉取的都是最新版本的包，旧的配置文件没有同步更新，就会触发这个报错。需要注意的是，这个校验是解析器层面的强制要求，和你实际代码里有没有用到JSX语法完全无关，哪怕你全是纯逻辑的后端代码，只要jsx参数值不合法，就会触发报错。

• 定位项目中ESLint的配置文件：找到和你tsconfig.json同目录下的.eslintrc.js/.eslintrc.json文件（如果是用Firebase CLI初始化的云函数项目，这个配置默认在functions子目录下，不是项目最外层根目录，找错路径改配置是不会生效的）
• 找到配置内的parserOptions字段，补充一行jsx: "preserve"配置
• 同时检查parserOptions内的project字段，确认它指向的路径就是你当前这份tsconfig.json的实际路径，避免解析器因为找不到配置文件用了无效的默认值触发报错
  补全后的parserOptions参考配置如下：

parserOptions: {
  ecmaVersion: 2020,
  sourceType: "module",
  project: "./tsconfig.json",
  tsconfigRootDir: __dirname,
  jsx: "preserve"
}

• 保存配置后重启VSCode的ESLint服务（按Ctrl+Shift+P输入ESLint: Restart ESLint Server执行），飘红的报错就会消失

• 你写的helloWorld云函数代码完全符合Firebase官方的写法规范，不需要做任何修改
• 选preserve作为jsx的配置值，是因为你写的是纯后端云函数，根本不会用到JSX语法，这个值只会告诉解析器不对JSX内容做转译处理，不会对实际代码运行、编译产生任何副作用
• 不需要特意在现有tsconfig.json里新增jsx配置项，只要在ESLint的解析配置里补全这个合法值就足够解决问题

内容的提问来源于stack exchange，提问作者Lukas Vis