如何将Web Animations API polyfill添加到使用Angular CLI创建的Angular 2项目中

如何将Web Animations API polyfill添加到使用Angular CLI创建的Angular 2项目中

问题描述:

Angular 2动画文档指的是 Web动画API填充,用于不支持本机浏览器的浏览器.

The Angular 2 animations documentation refers to the Web Animations API polyfill for browsers that don't support the native one.

将这个polyfill添加到使用Angular CLI创建的Angular 2项目中的正确方法是什么?

What's the proper way to add this polyfill to an Angular 2 project created with Angular CLI?

(我正在使用angular-cli:1.0.0-beta.10)

(I am using angular-cli: 1.0.0-beta.10)

没有运气,我尝试了这里提到的想法和解决方案:

With no luck, I have tried the ideas and solutions mentioned here:

  • https://github.com/angular/angular-cli/issues/949
  • https://github.com/angular/angular-cli/issues/1015
  • https://github.com/angular/angular-cli/issues/718#issuecomment-225493863

我通过NPM下载了它,并将其添加到了system-config.ts.我相信这符合推荐的原则,但是polyfill不会被加载(我可以说是因为动画在Safari中不起作用).

I downloaded it via NPM and added it to system-config.ts. I believe this is along the lines of what's recommended but the polyfill doesn't get loaded (I can tell because the animations don't work in Safari).

我只能通过在index.html中包含polyfill来使它起作用,我知道这不是正确的方法:

I only got this to work by including the polyfill in index.html, which I know it's not the proper way:

  <script src="https://rawgit.com/web-animations/web-animations-js/master/web-animations.min.js"></script>

我将在此处添加任何可能有助于澄清我的问题的细节,但是如果您需要查看代码,请在Github上找到它:

I will add here any details that may help clarify my question, but if you need to see the code, I have it on Github:

https://github.com/cmermingas/connect-four

提前谢谢!

角度6注意-不再需要Polyfill:-)

动画性能改进

我们已经更新了实施方式 动画不再需要Web动画polyfill.这 表示您可以从应用程序中删除此polyfill并保存 大约47KB的捆绑包大小,同时增加了动画 同时在Safari中获得更高的性能.

We’ve updated our implementation of Animations to no longer need the web animations polyfill. This means that you can remove this polyfill from your application and save approximately 47KB of bundle size, while increasing animations performance in Safari at the same time.

:-)

https://blog.angular.io/version-角现在有6个cc56b0efa7a4