我试图开发谷歌扩展,但发现我不能引用chrome
对象而不生成:
错误在E:/ChromeExtensions/.../node_modules/chrome-promise/chrome-promise.d.ts(2160,66):找不到命名空间“chrome”。
或
错误在E:/ChromeExtensions/.../src/app/chrome-tabs.servi ce.ts(14,7):找不到名称“chrome”。
我已经添加了chrome类型npm install --save @types/chrome
,但它不能解决构建错误。
有什么建议吗?
4条答案
按热度按时间ibrsph3r1#
基于How to use chrome-app.d.ts type in angular-cli 1.0.1 app?
1.我将
@types/chrome
添加到package.json1.我将
/// <reference types="chrome"/>
添加到ts文件的顶部zpjtge222#
2019年更新:
不再需要使用
/// <reference types="chrome"/>
。npm i -D @types/chrome
(以及在VScode中重新打开项目)应该足够了。当您克隆一个已经安装了
@types
库的存储库时,有时会发生这种情况。npm i
不能完成这项工作,但是如果您再次安装@types
库,它应该可以工作。n6lpvg4x3#
我也是这样。我正在使用Angular创建一个Chrome扩展:
| Package |版本|
| --------------|--------------|
| @Angular |14.0.4|
| @types/chrome| 0.0.193|
我安装的Chrome类型如文档所示(https://www.npmjs.com/package/@types/chrome):
我将
chrome
添加到tsconfig.app.json
文件中的types
:在那之后,我的代码编辑器(PHPStorm)在我的代码中考虑了
chrome
关键字。您可以在代码编辑器(https://angular.io/guide/file-structure)中为一个项目打开多个工作区,并且可以配置每个工作区所需的类型(在
tsconfig.app.json
文件中)。在这种情况下,代码编辑器将只考虑相关和已配置工作区的文件中的类型。2023年更新:
下面是我测试此配置的项目:https://github.com/jprivet-dev/chrome-extension-angular-starter-kit。
0s0u357o4#
最好有一个代码片段作为上下文。
然而,当我遇到这种情况时,这是因为我将
chrome
作为参数传递到函数中。但是,这样做是愚蠢的,因为chrome
是一个全局变量,因此可以从任何文件访问。不仅如此,由于JavaScript对象是按引用传递的,因此不需要传递全局变量(无论如何,您都在编辑同一个对象)。TL;DR:将
types/chrome
添加到package.json
,并且只从您正在处理的文件中访问全局变量(即chrome
或window
),而不是将其作为参数传递。将
chrome
作为参数传递(不好/不必要):使用
chrome
作为全局(良好):