为Firefox配置TypeScript，使其识别browser.storage等类型

你当前使用的@types/firefox包并非针对WebExtensions API的类型定义，它是旧版Firefox浏览器本身的类型集合，完全无法提供browser.storage这类扩展API的类型支持，这就是问题所在。

下面是两种可行的解决方案：

方案一：使用WebExtension Polyfill（推荐） #

这个工具不仅能统一Chrome和Firefox的扩展API调用方式，还自带完整的TypeScript类型支持：

1. 安装依赖：

   npm install webextension-polyfill
   npm install --save-dev @types/webextension-polyfill
   

2. 在代码中导入并使用：

   import browser from 'webextension-polyfill';
   
   // 示例调用
   browser.storage.sync.get('key').then(result => {
     console.log(result.key);
   });
   

方案二：复用Chrome类型声明（无需polyfill） #

如果不想引入polyfill，可以直接复用@types/chrome的类型来声明全局browser对象：

1. 卸载无用的@types/firefox：

   npm uninstall @types/firefox
   

2. 在你的源码目录（比如src/）下创建一个全局类型声明文件（例如global.d.ts），添加以下内容：

   declare const browser: typeof chrome;
   

3. 确保tsconfig.json的include数组包含该文件所在目录（你的配置里已经包含src，所以无需额外修改）。

这样TypeScript就能正确识别browser对象及其所有同步存储相关的API了。

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