时间戳

首页 > 解决方案 > 跨浏览器扩展

typescript - 跨浏览器扩展

问题描述

我正在尝试使用适用于所有浏览器的 TypeScript 编写扩展。我找到了这个包：我正在使用的https://www.npmjs.com/package/web-ext-types我已经在我的 package.json 中设置了。

在打字稿中，我可以输入浏览器并查看所有智能感知等，但是当我在 Chrome 中运行它时，我得到了异常：

Uncaught (in promise) ReferenceError: browser is not defined.

我的代码如下：

browser.webNavigation.onHistoryStateUpdated.addListener((e) => {
    console.log("webNavigation onHistoryStateUpdated");
    console.log(e);
    // do something here
});

我对打字稿和浏览器扩展非常陌生，如果我更改为 Chrome，它可以正常工作，但在 IE/Firefox 中将不受支持（也许是 firefox？）。我发现这篇文章：https ://www.smashingmagazine.com/2017/04/browser-extension-edge-chrome-firefox-opera-brave-vivaldi/建议将其放入：

window.browser = (function () {
    return window.msBrowser ||
        window.browser ||
        window.chrome;
})();

我的问题是我应该还是应该由 web-ext-types 处理这个？此外，当我尝试将其放在 TypeScript 中的任何位置时，我会收到错误消息：

类型窗口上不存在属性浏览器。目前我还包括：

"@types/chrome": "~0.0.63",

如果我使用 web-ext-types，我应该删除它吗？我也在使用 chrome.declarativeContent.onPageChanged ，它似乎不在浏览器中。

谢谢你的帮助。

标签： typescriptbrowser-extension

解决方案

我认为您可能正在寻找chrome.history.onVisited.addListener，它与 chrome 中的功能并不完全相同，但功能相似。

据我所知，chrome 上没有“浏览器”变量，但是，您也许可以制作某种 polyfill，原则上它可以工作。就像某种用于浏览器扩展的 jQuery。

推荐阅读