标签: polyfills

我正在将React代码转换为typescript,tsconfig中的目标是es5.

在IE 11中运行我收到错误"Promise is undefined"

我知道我需要填充,但如何？

我没有使用巴别塔.

以下是我的Webpack.config

var webpack = require("webpack");
var Promise = require('es6-promise').Promise;
var paths = require('./config/paths');
var HtmlWebpackPlugin = require('html-webpack-plugin');
//var InterpolateHtmlPlugin = require('react-dev-utils/InterpolateHtmlPlugin');
var AureliaWebpackPlugin = require('aurelia-webpack-plugin');

var publicPath = '/';
var publicUrl = '';

module.exports = {
    entry: {

    app: [
    'core-js/fn/promise',

    './Generated Files/app.js'
],
    vendor: paths.vendorPath,
},
output: {
    path:__dirname + "/dist",
    filename: 'bundle.js',
    publicPath: publicPath
},
devtool: '#source-map',
resolve: {
    extensions: ['', '.webpack.js', '.web.js', '.ts', '.tsx', '.js']
},
module: {
    loaders: [ …

谷歌在这方面让我失望(我认为因为PolyFill/Shim/Spackle的术语目前是新的和多样化的).我正在尝试为webkit找到一个好的JavaScript PolyFill或Shim(现在从RC FireFox 4开始)CSS转换.

我找到了Weston Ruter所做的这项工作,但它暂时没有更新,并且使用浏览器检测而不是功能检测.

我也发现了FakeSmile,但它主要面向SVG动画.

有谁知道任何好的库来填写这个功能？最好能与Modernizr合作并且仍在积极开展工作的东西.到目前为止,最好的选择看起来就像韦斯顿提出的那样.

在WordPress主题中,您如何有条件地包含ie8及以下的脚本？这主要是为各种html5/css3功能应用polyfill.我看到wp有$ is_IE变量,它可以用作条件,只包含IE的脚本.有没有办法只为某些版本的IE添加脚本而不是全部？这很简单,有些HTML即条件注释,但我想将脚本全部包含在我的函数文件中的相同位置.

HTML中特定版本的条件:

<!--[if lt IE 9]> <script src="iepolyfill.min.js"></script> <![endif]-->

WP中所有IE的条件:

    global $is_IE;

    if ( $is_IE ) {
        wp_enqueue_script( 'iepolyfill', bloginfo('stylesheet_directory').'/js/iepolyfill.min.js' );
    }

我环顾四周,主要只查找有关wp后端的条件脚本的详细信息.

有什么建议？

我使用 Webpack 5 创建了一个新的 React 项目，npx create-react-app client并遇到了一些问题。最初，我在 、 和 方面遇到了错误assert，os但stream通过安装它们并将它们包含在webpack.config.js. 该文件位于client/src文件夹中。

错误如下所示：

Compiled with problems:

    ERROR in ./node_modules/eth-lib/lib/bytes.js 9:193-227

    Module not found: Error: Can't resolve 'crypto' in 'C:\Users\Username\Projects\testProject\client\node_modules\eth-lib\lib'

    BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
    This is no longer the case. Verify if you need this module and configure a polyfill for it.

    If you want to include a …

我刚刚开始使用Angular2,并遇到了一个奇怪的组件文件扩展问题:

让我们使用angular.io的5分钟快速入门演示(我将在这里重现代码以供参考).

文件结构

angular2-quickstart
|- app
|  |- app.component.ts
|  |- boot.ts
|
|- index.html
|- package.json
|- tsconfig.json

的package.json

{
  "name": "angular2-quickstart",
  "version": "1.0.0",
  "scripts": {
    "tsc": "tsc",
    "tsc:w": "tsc -w",
    "lite": "lite-server",
    "start": "concurrent \"npm run tsc:w\" \"npm run lite\" "
  },
  "license": "ISC",
  "dependencies": {
    "angular2": "2.0.0-beta.0",
    "systemjs": "0.19.6",
    "es6-promise": "^3.0.2",
    "es6-shim": "^0.33.3",
    "reflect-metadata": "0.1.2",
    "rxjs": "5.0.0-beta.0",
    "zone.js": "0.5.10"
  },
  "devDependencies": {
    "concurrently": "^1.0.0",
    "lite-server": "^1.3.1",
    "typescript": "^1.7.3"
  }
}

tsconfig.json

{
  "compilerOptions": …

我需要一个JSON polyfill来支持IE 7和一些IE 8和IE 9模式.我应该选择JSON 2还是JSON 3？显然JSON 3是一个更现代的实现,但是例如像html5please这样的网站甚至没有提及它并推荐JSON 2.

我有一个使用fetch polyfill的项目isomorphic-fetch.我想用URLSearchParams来提交POST数据.对于fetch以支持URLSearchParams,它首先检查它是否在全局对象中可用.我虽然使用这个 polyfill但我不知道如何在webpack中正确导入它,所以fetch注意到它是可用的.

我怎么能做到这一点？谢谢!

我已经从RC4升级到Angular2的最终版本.当我运行时npm start,应用程序停留在"正在加载...",我得到的唯一错误是关于Zone.js:

基本上,typeof Zone未定义:

这是我的package.json:

"engines": {
"node": ">= 4.2.1",
"npm": "3.10.7"
},
"dependencies": {
"@angular/common": "2.0.0",
"@angular/compiler": "2.0.0",
"@angular/core": "2.0.0",
"@angular/forms": "2.0.0",
"@angular/http": "2.0.0",
"@angular/platform-browser": "2.0.0",
"@angular/platform-browser-dynamic": "2.0.0",
"@angular/platform-server": "2.0.0",
"@angular/router": "3.0.0",
"@salesforce-ux/design-system": "^2.0.3",
"angular2-busy": "^0.3.2-rc.6",
"chart.js": "2.1.0",
"core-js": "^2.4.0",
"d3": "^4.2.3",
"lodash": "^4.14.0",
"moment": "^2.14.1",
"ng2-bootstrap": "^1.1.4",
"ng2-charts": "^1.1.0",
"ng2-datepicker": "^1.0.6",
"ng2-pagination": "^0.4.1",
"normalize.css": "^4.1.1",
"rxjs": "5.0.0-beta.12",
"typescript": "2.1.0-dev.20160916",
"zone.js": "0.6.21"
},
"devDependencies": {
"@angular/compiler-cli": "^0.6.1",
"@types/core-js": "^0.9.28",
"@types/hammerjs": "^2.0.28",
"@types/jasmine": "^2.2.29",
"@types/lodash": "^4.14.34", …

respond.js或 CSS3,mediaqueries.js？

官方文档,特别是css3-mediaqueries.js的文档,是稀疏的.阅读SO,论坛和博客我总结了这些优点和缺点.

respond.js

优点:

1. 更可靠(？由Modernizr,Twitter Bootstrap 3和H5BP推荐)
2. 更轻(4kb),速度更快
3. 在任何上下文中解释mediaquery(<link>,内联CSS,@ import-ed CSS)

缺点:

1. 窗口大小调整时不更新
2. 仅支持min-width和max-width
3. 不支持em单位(巨大的弱点!)

CSS3-mediaqueries.js

优点:

1. 实时反应(调整大小!)
2. 支持em单位(真的吗？有人测试过吗？)

缺点:

1. 更重(15kb)并且更慢
2. 仅使用显式声明的媒体类型解释内联CSS
3. 缺乏详细的文档,项目似乎被放弃了

是否有人有要添加到列表中的点,或要分享的个人经历,或者对一个或另一个脚本的特定偏好？如果是这样,为什么？

如果有人知道解决更大问题的替代方法,则提供上下文.

问题背景

我正率先为使用Web组件的Web应用程序开发测试自动化框架.这在Internet Explorer中进行测试时出现了问题,因为Internet Explorer本身不支持Web组件; 相反,polyfill用于提供此功能.

对此的主要反应是,Selenium的大部分将无法按预期工作.它无法像在Firefox和Chrome中那样"看到"Internet Explorer中的Shadow DOM.

另一种方法是编写一个测试框架,它提供了一种通过JavaScript访问元素的替代机制 - 这允许元素通过polyfill定位.

我们当前的实现检查WebDriver正在使用的,并使用方法的原始Selenium实现(在Chrome或Firefox的情况下),或者我们自己的替代实现(在Internet Explorer的情况下).

这意味着我们希望我们的实现尽可能接近Selenium的实现,其核心是浏览器交互级别.

问题

我试图复制的功能Actions.click(WebElement onElement)(源),以简化形式(不继的生成器设计模式Actions类,并使得假设该点击是与鼠标左键并没有其他按键(Ctrl,Shift,Alt)正在举行下).

我想找到处理点击的核心代码(特别是在Chrome,Firefox和Internet Explorer中),所以我可以尽可能地复制它,但是我发现自己迷失在类和接口的深层. ..

创建一个新的ClickAction(源)(以后执行).执行此操作包括对Mouse接口实例(源)进行"click()"调用... aaaa并且我丢失了.我从生成的JavaDoc中看到,它是由EventFiringMouse(源代码)或HtmlUnitMouse(源代码)实现的,但我不确定将实现哪一个.我做了一个假设(没什么基础)HtmlUnitMouse可以使用,这让我进一步深入兔子洞看Gargoyle Software的HTMLUnit代码 ......

简而言之,我完全迷失了.

任何指导将不胜感激:)

研究

• 我发现我认为ChromeUnit,Firefox和Internet Explorer使用HTMLUnit是不正确的.文档显示RemoteWebDriver(源)由子类ChromeDriver,FirefoxDriver和InternetExplorerDriver.