两者似乎都在Web开发圈中使用,例如参见HTML5 Cross Browser Polyfills,它说:
所以我们在这里收集所有的垫片,后备和填充物......
或者,有es5-shim项目.
在我目前的项目中,我们使用了其中的一些,我想将它们全部放在同一目录中.那么,我该怎么称呼这个目录--- shims,或者polyfills?
HTML5中polyfills的含义是什么?我在许多网站上看到过关于HTML5的这个词,例如HTML5-Cross-Browser-Polyfills.
所以我们在这里收集所有垫片,后备和polyfill,以便在本身不支持它们的浏览器中植入HTML5功能.
我其实不明白polyfills是什么意思.
它是一种新的HTML5技术还是JavaScript库?我从来没有在HTML5之前听过这个词.
垫片,后备和填充物之间有什么区别?
我正在尝试使用RequireJS 2.0.1.我的目标是正确加载jQuery,Underscore和Backbone.从最初的RequireJS文档中我发现作者J. Burke(在这个新版本中)添加了一个名为shim的新配置选项.
然后我在这里写下这些东西:
index.html
<!DOCTYPE html>
<html>
<head>
<title>Testing time</title>
<script data-main="scripts/main" src="scripts/require.js"></script>
</head>
<body>
<h1>Testing time</h1>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
scripts/main.js
requirejs.config({
shim: {
'libs/jquery': {
exports: '$'
},
'libs/underscore': {
exports: '_'
},
'libs/backbone': {
deps: ['libs/underscore', 'libs/jquery'],
exports: 'Backbone'
}
}
});
define(
['libs/jquery', 'libs/underscore', 'libs/backbone'],
function (jQueryLocal, underscoreLocal, backboneLocal) {
console.log('local', jQueryLocal);
console.log('local', underscoreLocal);
console.log('local', backboneLocal);
console.log('global', $);
console.log('global', _);
console.log('global', Backbone);
}
);
Run Code Online (Sandbox Code Playgroud)
一切似乎工作得很好,但我觉得我缺少一些东西,我知道有jed和Underscore的AMD版本,但如果设置如此简单,我不明白为什么我应该使用它们.
那么,这个设置是正确的还是我错过了什么?
我正在为我的公司项目使用jquery,backbonejs,underscorejs和bootstrap.有时我在chrome中遇到这个错误.
未捕获的TypeError:无法读取未定义的属性"fn"
在我的main.js中,我的垫片是这样的
require.config({
paths: {
jquery: 'libs/jquery/jquery',
underscore: 'libs/underscore/underscore',
backbone: 'libs/backbone/backbone',
backboneeventbinder: 'libs/backbone.eventbinder.min',
bootstrap: 'libs/bootstrap',
jquerytablesorter: 'libs/tablesorter/jquery.tablesorter',
tablesorter: 'libs/tablesorter/tables',
ajaxupload: 'libs/ajax-upload',
templates: '../templates'
},
shim: {
'backbone': {
deps: ['underscore', 'jquery'],
exports: 'Backbone'
},
'underscore': {
exports: '_'
},
}
});
require(['app', ], function(App) {
App.initialize();
});
Run Code Online (Sandbox Code Playgroud)
我已经为jquery,underscorejs和backbonejs插入了.noConflict().
我的app.js.
// Filename: app.js
define(['jquery', 'underscore', 'backbone', 'backboneeventbinder', 'bootstrap', 'ajaxupload', 'router', // Request router.js
], function($, _, Backbone, Bootstrap, Backboneeventbinder, Ajaxupload, Router) {
$.noConflict();
_.noConflict();
Backbone.noConflict();
var initialize = function() { …Run Code Online (Sandbox Code Playgroud) 我正在开发一个需要使用某些库的不兼容版本的应用程序.我的直觉是在应用程序和库之间引入了一个适配器,它将在其中注入库的适当对象.然后,有人告诉我垫片.关于它的文献不多.
我想知道垫片与外观和适配器设计模式有何不同?什么是一些流行的用途?
如何为元素创建或使用现成的Shims来.net framework 4.6.1将它们(从.net framework 4.6.1)移植到.net core 2.0/ .net standard 2.0?
一些感兴趣的类:对于像以下类这样的类具有垫片会很好:
System.Windows.Threading.Dispatcher
要么
System.ComponentModel.ItemPropertyInfo.Descriptor
甚至
System.Windows.Controls.MenuItem
还有很多...
语境:
应用程序(代码)不是100%组织良好.业务逻辑与UI逻辑没有100%的分离.答案"先做重构"绝对是一个很好的答案.但就我而言,事情并非100%理想.
近似的例子,试图用手工做:
System.Windows.Threading.Dispatcher未实施Core 2.0.
人们可以尝试添加:
public enum DispatcherShimPriority
{
Background
//...
}
public interface DispaicherShim
{
void Invoke(Action action, DispatcherShimPriority prio);
void BeginInvoke(Action action, DispatcherShimPriority, prio);
}
Run Code Online (Sandbox Code Playgroud)
接下来是这个接口的两个实现:
public class DispatcherCore: DispaicherShim;
Run Code Online (Sandbox Code Playgroud)
和
public class DispatcherFramework: DispaicherShim;
Run Code Online (Sandbox Code Playgroud)
Shims在多目标项目中跟随aa类(让我们称之为):
public static DispaicherShim CreateDispatcher()
{
#if NETCOREAPP2_0
return new DispatcherCore(); …Run Code Online (Sandbox Code Playgroud) 我开发了工作D3驱动的图表,就所有其他浏览器而言,没有问题.
但最近在Internet Explorer 8中也需要支持它们.
但到目前为止,我无法在IE8中进行此html显示.
这些是D3中使用的标签:
<svg> <path> <g> <line> <circle> <rect>
Run Code Online (Sandbox Code Playgroud)
在过去的6个小时里,我浏览了很多材料和问题,包括:
" 在IE8中显示内联SVG ",其答案从2012年10月开始:
我也一直在研究这个问题,并提出了许多选择.
Chrome Frame - 一个实际上在底层使用chrome的浏览器插件,这意味着SVG正常运行.如果您能够将插件部署到浏览器,对于真实的商业环境,这是非常好的,但这可能是不可能的.
SVG Web - 目的是为所有浏览器带来SVG.它看起来像一个相当大的项目,有一个谷歌的输入.然而,这并不是开箱即用的D3虽然我对这些问题知之甚少.
D34Raphael - 你已经提到了这个,我再次发现它没有开箱即用.在GitHub上检查项目,几个月内没有任何提交活动,并且有一些拉取请求"首先试图获得对事件绑定所需的.on()的支持".如果它不支持事件,那对你来说是个问题吗?我一般都会远离这个.
R2D3 - 你提到的另一个.我从D3网站上获取了Sankey示例,并且必须进行一些更改才能使其正常工作.我无法工作的主要事项(拖动事件,组 - 虽然可以使用替代方案).花了大约一天的时间才能让这个例子在IE8中工作,我相信它处于可用的状态.GitHub上的项目也更加活跃,开发人员承诺,拉动工作并积极参与讨论等.这得到了我的投票.
也:
wikipedia.org/wiki/Scalable_Vector_Graphics
但是使用客户端插件的解决方案是不可接受的,到目前为止看起来我无法在IE8中显示svg.所以解决方案是找到一些其他方法来渲染矢量图.我认为其他人也有同样的问题
编辑:
无论哪种方式,在我之后会遇到同样问题的人至少会有一些集中的材料并且会意识到没有简单/真实的解决方案来在IE8上显示svg并且更好地花时间从现有代码重写/调整非-svg版本
编辑:
经过一些测试,我会说它值得尝试通过R2D3示例,看看它是否有可能简化/执行IE8中的代码
编辑:
在分别测试不同元素的过程中,似乎出现了一些r2d3问题
最常见的是Invalid参数,Object不支持此属性或方法
因为我不习惯为IE8开发,所以我发现了一些有用的提示:
嗯我不确定是否有人遇到过这个问题
IE6上的简短描述任何<select>对象都显示在任何其他项目上,甚至是div ...意思是如果你有一个花哨的javascript效果显示一个应该在顶部的div一切(例如:灯箱,多箱等等)onclick某个元素,并且div与<select>你的div get 重叠显示,好像它在<select>[在这种情况下最大和最小z-index不起作用]
我已经尝试谷歌搜索并找到了iframe垫片解决方案,
但我想要一些非常干净的替代品或者更好,但有没有人找到更好的解决方案?因为使用iframes的方法使用大约130mb的ram可能会减慢穷人的机器速度
我试图让TinyMCE的通过的WebPack认可.它设置了一个名为tinymceon 的属性window,所以显然有一个选项是require()使用这样的语法(在webpack文档的EXPORTING 部分的底部描述):
require("imports?window=>{}!exports?window.XModule!./file.js
但在这个例子中,如何./file.js解决?我通过npm安装了tinymce,我无法弄清楚如何指定tinymce.js文件的正确路径.
无论如何,我宁愿在我的配置中处理这个问题,并且require('tinymce')如果可能的话,我可以安装exports-loader并添加以下内容(基于此讨论):
module: {
loaders: [
{
test: /[\/]tinymce\.js$/,
loader: 'exports?tinymce'
}
]
}
Run Code Online (Sandbox Code Playgroud)
不幸的是,这不起作用.我的配置有什么问题?
shim ×10
javascript ×4
terminology ×3
html5 ×2
polyfills ×2
vocabulary ×2
.net ×1
.net-core ×1
backbone.js ×1
c# ×1
d3.js ×1
definition ×1
fallback ×1
jquery ×1
naming ×1
node.js ×1
porting ×1
requirejs ×1
svg ×1
tinymce ×1
webpack ×1