jlengrand/webcomponentsjs
1
0
Fork 0
mirror of https://github.com/jlengrand/webcomponentsjs.git synced 2026-03-10 08:51:22 +00:00
Code Issues Packages Projects Releases Wiki Activity

Cleanup README

Browse Source 
Fix es5 loader by checking for the correct name :P
This commit is contained in:
Daniel Freedman
2017-03-06 14:43:58 -08:00
parent 6bc018e2c9
commit d16447a82a
3 changed files with 7 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
README.md
View File

@@ -63,9 +63,7 @@ elements, etc.). Here's an example:
## `webcomponents-es5-loader.js`
Due to the requirement that Custom Elements be ES6 classes (https://html.spec.whatwg.org/multipage/scripting.html#custom-element-conformance), it may make sense to precompile your elements down to ES5 for wider consumption.
However, this will conflict with the presence of native Custom Elements in browsers that support them.
For these scenarios, use the `webcomponents-es5-loader.js` file to use the Custom Elements native compatibility shim where needed.
Custom Elements must be ES6 classes (https://html.spec.whatwg.org/multipage/scripting.html#custom-element-conformance). Since most projects need to support a wide range of browsers that don't necessary support ES6, it may make sense to compile your project to ES5. However, ES5-style custom element classes will not work with native Custom Elements because ES5-style classes cannot properly extend ES6 classes, like `HTMLElement`.
## Browser Support

5
webcomponents-es5-loader.js
View File

@@ -10,6 +10,7 @@
(function() {
'use strict';
var name = 'webcomponents-es5-loader.js';
// Feature detect which polyfill needs to be imported.
var polyfills = [];
if (!('import' in document.createElement('link'))) {
@@ -35,11 +36,11 @@
}
if (polyfills.length) {
var script = document.querySelector('script[src*="webcomponents-loader.js"]');
var script = document.querySelector('script[src*="' + name + '"]');
var newScript = document.createElement('script');
// Load it from the right place.
var replacement = 'webcomponents-' + polyfills.join('-') + '.js';
var url = script.src.replace('webcomponents-loader.js', replacement);
var url = script.src.replace(name, replacement);
newScript.src = url;
document.head.appendChild(newScript);
} else {

5
webcomponents-loader.js
View File

@@ -10,6 +10,7 @@
(function() {
'use strict';
var name = 'webcomponents-loader.js';
// Feature detect which polyfill needs to be imported.
var polyfills = [];
if (!('import' in document.createElement('link'))) {
@@ -33,11 +34,11 @@
}
if (polyfills.length) {
var script = document.querySelector('script[src*="webcomponents-loader.js"]');
var script = document.querySelector('script[src*="' + name +'"]');
var newScript = document.createElement('script');
// Load it from the right place.
var replacement = 'webcomponents-' + polyfills.join('-') + '.js';
var url = script.src.replace('webcomponents-loader.js', replacement);
var url = script.src.replace(name, replacement);
newScript.src = url;
document.head.appendChild(newScript);
} else {