标签: polyfills

如何为 IE8 填充 Array.prototype.includes()

我正在尝试填充数组方法 includes() 以与 IE8 一起使用,我需要支持一个项目并且我不想使用 indexOf()。

我知道有一个 polyfill,所以我去了:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes#Polyfill

并将其包含在我的脚本顶部。

IE8 对 Object.defineProperty() 的支持有限,所以我也对它进行了 polyfill:https : //developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperties#Polyfill

最后,我需要 polyfill Object.keys():https : //developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/keys#Polyfill

放在一起,我的 polyfills 是:

if (!Object.keys) {
  Object.keys = (function() {
    'use strict';
    var hasOwnProperty = Object.prototype.hasOwnProperty,
        hasDontEnumBug = !({ toString: null }).propertyIsEnumerable('toString'),
        dontEnums = [
          'toString',
          'toLocaleString',
          'valueOf',
          'hasOwnProperty',
          'isPrototypeOf',
          'propertyIsEnumerable',
          'constructor'
        ],
        dontEnumsLength = dontEnums.length;

    return function(obj) {
      if (typeof obj !== 'function' && (typeof obj !== 'object' || obj === null)) {
        throw new …
Run Code Online (Sandbox Code Playgroud)

javascript polyfills

8
推荐指数
2
解决办法
7065
查看次数

为什么console.log()polyfill不使用Function.apply()?

我一直在寻找一些流行的console.log()包装纸/填料:

我注意到他们都接受多个arguments,但他们都做这样的事情:

console.log(arguments);
Run Code Online (Sandbox Code Playgroud)

这导致像这样的输出(在Chrome中):

<code>console.log()</code>也接受多个参数,这样就可以产生(恕我直言)卓越的输出:</p>

<pre><code>console.log.apply(console, arguments)
</code></pre><a target=Run Code Online (Sandbox Code Playgroud)

这导致像这样的输出(在Chrome中):

<code>console.log.apply()</code>多个参数?或者这仅仅是品味或节省字节的问题?</p> </div>
        <p>
          <a href=javascript debugging polyfills

7
推荐指数
1
解决办法
1754
查看次数

使用MDN结合填充物是否存在风险?

我开发了一个需要该bind方法的Javascript库.不幸的是,bindIE8不支持.

MDN网站上有一个polyfill ,效果很好.

我的问题是:这个polyfill和其他Javascript库之间是否存在问题或可能存在不兼容性?

在任何情况下都可以安全使用?

javascript polyfills

7
推荐指数
1
解决办法
1778
查看次数

聚合物和Web组件之间的区别polyfill?

我是一名新开发人员,我很难找到能够清楚地识别Polyfill和Polymer之间差异的任何东西.

我很确定Polyfill是/或使用platform.js webcomponents.js的一部分,而webcomponents.js反过来又是大多数浏览器用来确保Web组件尚未完全支持的用途的一部分.而Polymer使用某种形式的模板,如Angular的指令,但它似乎是未来网络的一个更永久的固定装置.

任何人都可以提供更明确的定义或链接,以阐明两者之间的差异吗?

web-component polyfills polymer

7
推荐指数
1
解决办法
2003
查看次数

如何为扩展运算符创建 polyfill

我试图为扩展运算符创建一个 polyfill。我的目标是创建类似于扩展运算符的东西,我可以使用三个@@@ 符号代替三个点。

例如,在 ES6 中

function sum(x, y, z) {
  return x + y + z;
}

const numbers = [1, 2, 3];

console.log(sum(...numbers));
// expected output: 6
Run Code Online (Sandbox Code Playgroud)

我试图实现类似的功能


// Instead of triple dots, it should be triple @
console.log(sum(@@@numbers));
// expected output should be 6

Run Code Online (Sandbox Code Playgroud)

我希望的输出console.log(sum(@@@numbers));6.

javascript polyfills ecmascript-6

7
推荐指数
1
解决办法
7350
查看次数

如何修复错误:未处理的承诺拒绝:this._next 不是函数;区域: &lt;root&gt; ; 任务:ServiceWorkerContainer.addEventListener:message

当我在前台收到 firebase 推送通知时会发生此错误。请注意,推送通知在后台运行良好(即当浏览器最小化或关闭时)。我已经安装了最新版本的@angular/fire@6.0.0 和 firebase@7.13.2。我不确定这是 firebase 还是 @angular/fire 的问题,还是我需要向 plyfills.ts 添加一些代码

接收通知的方法


receiveMessage() {
    this.ngFireMessaging.messages.subscribe(
      (message: any) => {
        console.log(message);
        this.currentMessage$.next(message);
      });
  }

Run Code Online (Sandbox Code Playgroud)

Angular CLI 版本

Angular CLI: 9.1.0
Node: 12.16.0
OS: win32 x64

Angular: 9.1.0
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router, service-worker
Ivy Workspace: Yes

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.900.7
@angular-devkit/build-angular     0.901.0
@angular-devkit/build-optimizer   0.901.0
@angular-devkit/build-webpack     0.901.0
@angular-devkit/core              9.1.0
@angular-devkit/schematics        9.1.0
@angular/cdk                      9.2.0
@angular/fire                     6.0.0
@angular/material                 9.2.0
@ngtools/webpack                  9.1.0
@schematics/angular               9.1.0
@schematics/update …
Run Code Online (Sandbox Code Playgroud)

polyfills firebase angularfire firebase-cloud-messaging angular9

7
推荐指数
1
解决办法
2093
查看次数

当任何承诺已经实现时,是否有可能脱离 await Promise.all (Chrome 80)

我需要向多服务器发送请求,以查看哪个服务器将响应我的请求,如果其中任何一个响应,我将进一步与该服务器交互。最简单的方法是按顺序发送我的请求,像这样

async function probing(servers) {
    for (const server of servers) {
        const result = await fetch(server)
        if (result.status == 200) {
            return result
        }
    }
}
Run Code Online (Sandbox Code Playgroud)

但我希望加快探测过程,所以我将代码更改为

async function probing(servers) {
    results = await Promise.all(
        servers.map(async server => {
            return await fetch(server)
        })
    )
    for (const result of results) {
        if (result.status == 200) return result
    }
}
Run Code Online (Sandbox Code Playgroud)

但我仍然需要等待所有的承诺完成。我真正需要的是,如果其中一个有决心,我就从我的探测中返回()

那有可能吗?

- - 更新 - -

感谢评论promise.any是解决方案(单线箭头函数可以进一步简化如下)

result = await Promise.any(
    servers.map(server => fetch(server))
)
Run Code Online (Sandbox Code Playgroud)

---- 更新 …

javascript google-chrome promise async-await polyfills

7
推荐指数
1
解决办法
191
查看次数

Webpack 5 不支持 Node.js 的 polyfill

我有一个适用于 Angular 和 Node.js 的 npm 包。最近,我开始在 Angular v12 项目中使用我的包。我收到如下错误:

重大更改:webpack < 5 默认情况下包含 Node.js 核心模块的 Polyfill。这已不再是这种情况。验证您是否需要此模块并为其配置一个polyfill。

我需要这些包(例如'path'),并且我无法切换到Webpack替代方案(例如'path-browserify'),因为我需要它在nodejs上工作。

错误说:

如果你想包含一个polyfill,你需要: - 添加后备 'resolve.fallback: { "path": require.resolve("path-browserify") }' - 安装 'path-browserify'

安装“path-browserify”很简单。但是,该错误并未说明在何处添加后备。我在一些帖子中发现建议我需要将其添加到 Webpack.config.js 中。但在Angular项目中,没有这个文件;添加它没有任何效果。即使有这样的文件,它也对我没有帮助,因为我是一个 npm 包,并且我无法更改使用我的应用程序中的文件。

我可以为“path”包编写一个解决方法。但是,其他软件包引发了该错误。有些包(例如,suppertest)并不意味着可以在 webpack 中工作,并且在 Angular 上运行时我没有使用它们,但由于它们在我的代码中,所以 webpack 仍然会引发此错误。我还使用其他软件包,这些软件包本身使用有问题的软件包,例如“路径”或“流”,并且我无法更改它们。如何解决这个问题?

node.js npm polyfills webpack angular

7
推荐指数
1
解决办法
6228
查看次数

类型“Crypto”上不存在属性“randomUUID”

我试图在我的 Angular 应用程序 v13.1 中使用crypto.randomUUID,但它似乎不可用。如果您尝试以下操作,则会出现此错误:

TS2339:类型“Crypto”上不存在属性“randomUUID”

看起来对它的支持已合并到 Typescript 4.6 版本中。Angular 13.1 与 TypeScript 4.6 不兼容,如果您尝试以下操作,则会出现此错误:

错误:Angular 编译器需要 TypeScript >=4.4.2 和 <4.6.0,但找到了 4.6.3。

有没有办法将当前的实现填充crypto.randomUUID到 TypeScript 4.5 中?

我想避免直接使用uuid及其相关的 TypeScript 类型,但如果有必要,我愿意将其用作 TypeScript 4.5 的填充。

polyfills typescript angular

7
推荐指数
1
解决办法
1万
查看次数

Angular14:支持旧版浏览器的官方方式是什么?

支持旧浏览器的“Angular 方式”是什么?

默认情况下,Angular 14 应用程序(使用 构建angular-cli)仅支持 20% 的浏览器 ( browsersl.ist )。尽管阅读了相关文档,但我不清楚如何启用对旧版浏览器的支持。

改变.browserslistrc

默认情况下 angular-cli (v14) 生成此配置:

last 1 Chrome version
last 1 Firefox version
last 2 Edge major versions
last 2 Safari major versions
last 2 iOS major versions
Firefox ESR
Run Code Online (Sandbox Code Playgroud)

我已将其修改为以下内容。覆盖范围应从 20% 上升到 90%。然而,更旧的设备会显示“死机白屏”。

> 0.2%, not dead
Run Code Online (Sandbox Code Playgroud)

其他一些相关文件:

tsConfig.json

这里 Angular cli (v14) 默认放置这些:

last 1 Chrome version
last 1 Firefox version
last 2 Edge major versions
last 2 Safari major versions …
Run Code Online (Sandbox Code Playgroud)

polyfills angular angular14

7
推荐指数
1
解决办法
4909
查看次数