bikesheddingCSS3属性还有其他选择吗？它似乎还没有得到支持.
好的,所以我使用Respond.js将polyfill用于旧版浏览器上的媒体查询(ie8是最重要的).
与此同时,我正在研究使用Enquire.js,它可以根据媒体查询匹配执行js-code.
孤立地测试这个东西有效:
然而,组合似乎不起作用.即:
Enquire.js不会根据通过respond.js启用的媒体查询执行javascript(对于旧版浏览器)
由于Respond.js包含Paul Irish的MatchMedia的polyfill(根据:Inquire的文档)应该足以支持遗产,我不确定会出现什么问题.
所以只是要检查:这个组合应该正常吗？
我一直在浏览Mozilla开发者网络(MDN)上的polyfill实现,因为我需要其中一些用于库.我知道shim.js存在,但我没有使用它.
似乎polyfill在代码样式方面不一致.几乎看起来它们是由社区以几乎"维基"的方式编写的.
举个例子 String.prototype.contains
if(!('contains' in String.prototype)) {
String.prototype.contains = function(str, startIndex) {
return -1 !== String.prototype.indexOf.call(this, str, startIndex);
}
}
对我来说,实现这一点似乎更合乎逻辑:
if(!String.prototype.contains) {
String.prototype.contains = function(str, startIndex) {
return this.indexOf(str, startIndex) !== -1;
}
}
鉴于JavaScript是一种大小关键的语言(因为网络传输的所有内容应尽可能小),我的示例应该对MDN上的示例有利,因为这样可以节省几个字节.
正如标题所示,我想知道代码在MDN上的可靠性,我是否应该根据需要对其进行修改以尽可能提供真正干净,微小的实现？
我正在尝试按照https://www.webcomponents.org/polyfills/中的解释来填充web组件,因为我希望我的示例应用程序可以在Chrome和Firefox上运行.但是我得到了ReferenceError:Firefox中没有定义customElements错误.请参阅下面的index.html代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="robots" content="index, follow">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>Sample</title>
<link rel="stylesheet" href="css/site.css">
<!-- Components -->
<link rel="import" href="components/global/site-navigation.html">
</head>
<body>
<script>
(function () {
if ('registerElement' in document
&& 'import' in document.createElement('link')
&& 'content' in document.createElement('template')) {
// platform is good!
} else {
// polyfill the platform!
var e = document.createElement('script');
e.src = 'js/webcomponents.js';
document.body.appendChild(e);
}
})();
</script>
<site-navigation></site-navigation>
</body>
</html>
我错过了什么？
PS:Chrome中一切正常(有/无填充)
我热衷于在移动设备上使用此技术，但野生动物园不支持该技术-因此，为什么需要对它进行填充。
我目前<script src="assets/polyfills/intersection-observer.js"></script>在的头部，index.html但这样做后无法加载我的应用。
我正在使用Angular cli，并尝试了polyfill文件无济于事。成功地使它在Angular 4移动设备上运行的人可以帮助我吗？
谢谢
在它的npm 页面中whatwg-fetch说：
导入将自动填充 window.fetch 和相关 API：
Run Code Online (Sandbox Code Playgroud)import 'whatwg-fetch' window.fetch(...)
在同一部分的下面它说
要与 webpack 一起使用，请在应用程序入口点之前的入口配置选项中添加此包：
Run Code Online (Sandbox Code Playgroud)entry: ['whatwg-fetch', ...]
我用webpack.
我应该同时导入它并将其添加为条目，还是条目足够了？
在我们的项目中我们已经使用了Object.keys()很多Object.values()！由于它是基于 Magento (1) 的，所以我们用 Prototype.js 对其进行了填充（不知道它来自于此）。
然而，我们发现了一些似乎与 Prototype.js 直接相关的性能问题，因此我们希望将其删除。
我不想改变它们使用的每个位置。相反，我想要一个好的polyfill，它只为默认不支持它的浏览器加载。我希望将 polyfill 托管在我们的服务器上，以避免在 CDN 关闭时出现任何奇怪的错误（我们有自己的 CDN 解决方案）。
Babel 的一切都让我感到困惑。Webpack 对我来说也是半新的，有时令人困惑。 webpack.config 的语法似乎发生了变化，因为我们正在使用一些旧的规范。尝试遵循文档并通过谷歌搜索答案会更加令人困惑。我想我们应该更新到新规范。很快的某个时间。
我们今天有相关部分，
webpack.config.js：
const path = require('path');
const webpack = require('webpack');
const BUILD_DIR = path.resolve(__dirname, 'build/');
const APP_DIR = path.resolve(__dirname, 'src/');
module.exports = function config(env, argv = {}) {
return {
entry: ['core-js', 'formdata-polyfill', 'whatwg-fetch', `${APP_DIR}/index.js`],
output: {
path: BUILD_DIR,
filename: 'react-frontend.js',
},
resolve: {
extensions: ['.js', '.jsx'],
modules: [
path.resolve(__dirname, 'src/'),
'node_modules',
],
alias: …我正在使用新的 URL 在我的 angular 应用程序中创建一个 URL，如下所示。这适用于除 IE11 之外的所有浏览器。
所以我尝试将“url-polyfill”添加到我的“package.json”并在 polyfills.ts 文件中使用 import 'url-polyfill' 。
但是我仍然在 IE11 中得到对象不支持此行的操作错误。任何人都可以提供一些关于我在这里做错了什么的想法。
url = new URL(url).pathname.toLowerCase()
我的应用程序在 Firefox 和 Google Chrome 上运行良好，但不幸的是在 IE 11 或 Edge 上无法运行。我已经安装"react-app-polyfill": "^1.0.6"，添加了所有需要的 polyfill，如下所述：
索引.js
import 'react-app-polyfill/ie11';
import 'react-app-polyfill/stable';
包.json
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version",
"last 1 ie version"
]
}
IE11 上的错误：
TypeError: Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.
_createForOfIteratorHelper
node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/createForOfIteratorHelper.js:54
> 54 | throw new TypeError("Invalid …来自不同来源的许多函数似乎使用“etnro i”的子集作为变量和参数名称。Jquery 的大部分函数都使用这个。许多 polyfill 脚本使用这些参数。我见过其他脚本使用这些。为什么要以这种特定顺序使用这些特定变量名称？这些脚本是否使用相同的程序最小化？使用它有什么好处吗？
polyfills ×10
javascript ×6
angular ×2
reactjs ×2
shim ×2
webpack ×2
babeljs ×1
css ×1
css3 ×1
enquire.js ×1
fetch ×1
html-imports ×1
jquery ×1
mozilla ×1
shadow-dom ×1
w3c ×1