EML not working without a transpiler #511

xeaone · 2016-08-03T22:11:14Z

From the docs it seems as though you can use EML without a transpiler is that not correct?

error

TypeError: Error loading http://local:8082/index.js
    Cannot read property 'match' of undefined
    at f.normalize (http://local:8082/dep/es6-module-loader.js:7:11316)
    at f.instantiate (http://local:8082/dep/es6-module-loader.js:7:11508)
    at http://local:8082/dep/es6-module-loader.js:7:4459

index.html

<html>
<head>
    <script src="es6-module-loader.js"></script>
</head>
<body>

       <script>
        System.import('index.js')
        .then(function (m) { console.log(m); })
        .catch(function (error) { console.log(error); });
    </script>

</body>
</html>

index.js

console.log('hello world');

es6-module-loader.js

/*
 *  es6-module-loader v0.17.11
 *  https://github.com/ModuleLoader/es6-module-loader
 *  Copyright (c) 2016 Guy Bedford, Luke Hoban, Addy Osmani; Licensed MIT
 */

!function(a){function b(a,c){if("string"!=typeof a)throw new TypeError("URL must be a string");var d=String(a).replace(/^\s+|\s+$/g,"").match(/^([^:\/?#]+:)?(?:\/\/(?:([^:@\/?#]*)(?::([^:@\/?#]*))?@)?(([^:\/?#]*)(?::(\d*))?))?([^?#]*)(\?[^#]*)?(#[\s\S]*)?/);if(!d)throw new RangeError("Invalid URL format");var e=d[1]||"",f=d[2]||"",g=d[3]||"",h=d[4]||"",i=d[5]||"",j=d[6]||"",k=d[7]||"",l=d[8]||"",m=d[9]||"";if(void 0!==c){var n=c instanceof b?c:new b(c),o=!e&&!h&&!f;!o||k||l||(l=n.search),o&&"/"!==k[0]&&(k=k?(!n.host&&!n.username||n.pathname?"":"/")+n.pathname.slice(0,n.pathname.lastIndexOf("/")+1)+k:n.pathname);var p=[];k.replace(/^(\.\.?(\/|$))+/,"").replace(/\/(\.(\/|$))+/g,"/").replace(/\/\.\.$/,"/../").replace(/\/?[^\/]*/g,function(a){"/.."===a?p.pop():p.push(a)}),k=p.join("").replace(/^\//,"/"===k[0]?"/":""),o&&(j=n.port,i=n.hostname,h=n.host,g=n.password,f=n.username),e||(e=n.protocol)}"file:"==e&&(k=k.replace(/\\/g,"/")),this.origin=h?e+(""!==e||""!==h?"//":"")+h:"",this.href=e+(e&&h||"file:"==e?"//":"")+(""!==f?f+(""!==g?":"+g:"")+"@":"")+h+k+l+m,this.protocol=e,this.username=f,this.password=g,this.host=h,this.hostname=i,this.port=j,this.pathname=k,this.search=l,this.hash=m}a.URLPolyfill=b}("undefined"!=typeof self?self:global),function(a){function b(a,b){return a instanceof Error?(a.message=b+"\n  "+a.message,Error.call(a,a.message)):a=b+"\n    "+a,a}function c(a,c,d){try{new Function(a).call(d)}catch(e){throw b(e,"Evaluating "+c)}}function d(){}function e(b){this._loader={loaderObj:this,loads:[],modules:{},importPromises:{},moduleRecords:{}},j(this,"global",{get:function(){return a}})}function f(){e.call(this),this.paths={}}function g(a,b){var c,d="",e=0;for(var f in a){var g=f.split("*");if(g.length>2)throw new TypeError("Only one wildcard in a path is permitted");if(1==g.length){if(b==f)return a[f];if(b.substr(0,f.length-1)==f.substr(0,f.length-1)&&(b.length<f.length||b[f.length-1]==f[f.length-1])&&"/"==a[f][a[f].length-1])return a[f].substr(0,a[f].length-1)+(b.length>f.length?"/"+b.substr(f.length):"")}else{var h=g[0].length;h>=e&&b.substr(0,g[0].length)==g[0]&&b.substr(b.length-g[1].length)==g[1]&&(e=h,d=f,c=b.substr(g[0].length,b.length-g[1].length-g[0].length))}}var i=a[d];return"string"==typeof c&&(i=i.replace("*",c)),i}function h(){}var i=("undefined"==typeof window&&"undefined"!=typeof self&&"undefined"!=typeof importScripts,"undefined"!=typeof window&&"undefined"!=typeof document,"undefined"!=typeof process&&"undefined"!=typeof process.platform&&!!process.platform.match(/^win/));a.console||(a.console={assert:function(){}});var j,k=Array.prototype.indexOf||function(a){for(var b=0,c=this.length;c>b;b++)if(this[b]===a)return b;return-1};!function(){try{Object.defineProperty({},"a",{})&&(j=Object.defineProperty)}catch(a){j=function(a,b,c){try{a[b]=c.value||c.get.call(a)}catch(d){}}}}();var l;if("undefined"!=typeof document&&document.getElementsByTagName){if(l=document.baseURI,!l){var m=document.getElementsByTagName("base");l=m[0]&&m[0].href||window.location.href}l=l.split("#")[0].split("?")[0],l=l.substr(0,l.lastIndexOf("/")+1)}else if("undefined"!=typeof process&&process.cwd)l="file://"+(i?"/":"")+process.cwd()+"/",i&&(l=l.replace(/\\/g,"/"));else{if("undefined"==typeof location)throw new TypeError("No environment baseURI");l=a.location.href}var n=a.URLPolyfill||a.URL;j(d.prototype,"toString",{value:function(){return"Module"}}),function(){function f(a){return{status:"loading",name:a,linkSets:[],dependencies:[],metadata:{}}}function g(a,b,c){return new Promise(n({step:c.address?"fetch":"locate",loader:a,moduleName:b,moduleMetadata:c&&c.metadata||{},moduleSource:c.source,moduleAddress:c.address}))}function h(a,b,c,d){return new Promise(function(e,f){e(a.loaderObj.normalize(b,c,d))}).then(function(b){var c;if(a.modules[b])return c=f(b),c.status="linked",c.module=a.modules[b],c;for(var d=0,e=a.loads.length;e>d;d++)if(c=a.loads[d],c.name==b)return c;return c=f(b),a.loads.push(c),i(a,c),c})}function i(a,b){l(a,b,Promise.resolve().then(function(){return a.loaderObj.locate({name:b.name,metadata:b.metadata})}))}function l(a,b,c){m(a,b,c.then(function(c){return"loading"==b.status?(b.address=c,a.loaderObj.fetch({name:b.name,metadata:b.metadata,address:c})):void 0}))}function m(b,d,e){e.then(function(e){return"loading"==d.status?Promise.resolve(b.loaderObj.translate({name:d.name,metadata:d.metadata,address:d.address,source:e})).then(function(a){return d.source=a,b.loaderObj.instantiate({name:d.name,metadata:d.metadata,address:d.address,source:a})}).then(function(e){if(void 0===e)return d.address=d.address||"<Anonymous Module "+ ++A+">",d.isDeclarative=!0,z.call(b.loaderObj,d).then(function(b){var e=a.System,f=e.register;e.register=function(a,b,c){"string"!=typeof a&&(c=b,b=a),d.declare=c,d.depsList=b},c(b,d.address,{}),e.register=f});if("object"!=typeof e)throw TypeError("Invalid instantiate return value");d.depsList=e.deps||[],d.execute=e.execute,d.isDeclarative=!1}).then(function(){d.dependencies=[];for(var a=d.depsList,c=[],e=0,f=a.length;f>e;e++)(function(a,e){c.push(h(b,a,d.name,d.address).then(function(b){if(d.dependencies[e]={key:a,value:b.name},"linked"!=b.status)for(var c=d.linkSets.concat([]),f=0,g=c.length;g>f;f++)p(c[f],b)}))})(a[e],e);return Promise.all(c)}).then(function(){d.status="loaded";for(var a=d.linkSets.concat([]),b=0,c=a.length;c>b;b++)r(a[b],d)}):void 0})["catch"](function(a){d.status="failed",d.exception=a;for(var b=d.linkSets.concat([]),c=0,e=b.length;e>c;c++)s(b[c],d,a)})}function n(a){return function(b,c){var d=a.loader,e=a.moduleName,g=a.step;if(d.modules[e])throw new TypeError('"'+e+'" already exists in the module table');for(var h,j=0,k=d.loads.length;k>j;j++)if(d.loads[j].name==e&&(h=d.loads[j],"translate"!=g||h.source||(h.address=a.moduleAddress,m(d,h,Promise.resolve(a.moduleSource))),h.linkSets.length&&h.linkSets[0].loads[0].name==h.name))return h.linkSets[0].done.then(function(){b(h)});var n=h||f(e);n.metadata=a.moduleMetadata;var p=o(d,n);d.loads.push(n),b(p.done),"locate"==g?i(d,n):"fetch"==g?l(d,n,Promise.resolve(a.moduleAddress)):(n.address=a.moduleAddress,m(d,n,Promise.resolve(a.moduleSource)))}}function o(a,b){var c={loader:a,loads:[],startingLoad:b,loadingCount:0};return c.done=new Promise(function(a,b){c.resolve=a,c.reject=b}),p(c,b),c}function p(a,b){if("failed"!=b.status){for(var c=0,d=a.loads.length;d>c;c++)if(a.loads[c]==b)return;a.loads.push(b),b.linkSets.push(a),"loaded"!=b.status&&a.loadingCount++;for(var e=a.loader,c=0,d=b.dependencies.length;d>c;c++)if(b.dependencies[c]){var f=b.dependencies[c].value;if(!e.modules[f])for(var g=0,h=e.loads.length;h>g;g++)if(e.loads[g].name==f){p(a,e.loads[g]);break}}}}function q(a){var b=!1;try{w(a,function(c,d){s(a,c,d),b=!0})}catch(c){s(a,null,c),b=!0}return b}function r(a,b){if(a.loadingCount--,!(a.loadingCount>0)){var c=a.startingLoad;if(a.loader.loaderObj.execute===!1){for(var d=[].concat(a.loads),e=0,f=d.length;f>e;e++){var b=d[e];b.module=b.isDeclarative?{name:b.name,module:B({}),evaluated:!0}:{module:B({})},b.status="linked",t(a.loader,b)}return a.resolve(c)}var g=q(a);g||a.resolve(c)}}function s(a,c,d){var e=a.loader;a:if(c)if(a.loads[0].name==c.name)d=b(d,"Error loading "+c.name);else{for(var f=0;f<a.loads.length;f++)for(var g=a.loads[f],h=0;h<g.dependencies.length;h++){var i=g.dependencies[h];if(i.value==c.name){d=b(d,"Error loading "+c.name+' as "'+i.key+'" from '+g.name);break a}}d=b(d,"Error loading "+c.name+" from "+a.loads[0].name)}else d=b(d,"Error linking "+a.loads[0].name);for(var j=a.loads.concat([]),f=0,l=j.length;l>f;f++){var c=j[f];e.loaderObj.failed=e.loaderObj.failed||[],-1==k.call(e.loaderObj.failed,c)&&e.loaderObj.failed.push(c);var m=k.call(c.linkSets,a);if(c.linkSets.splice(m,1),0==c.linkSets.length){var n=k.call(a.loader.loads,c);-1!=n&&a.loader.loads.splice(n,1)}}a.reject(d)}function t(a,b){if(a.loaderObj.trace){a.loaderObj.loads||(a.loaderObj.loads={});var c={};b.dependencies.forEach(function(a){c[a.key]=a.value}),a.loaderObj.loads[b.name]={name:b.name,deps:b.dependencies.map(function(a){return a.key}),depMap:c,address:b.address,metadata:b.metadata,source:b.source,kind:b.isDeclarative?"declarative":"dynamic"}}b.name&&(a.modules[b.name]=b.module);var d=k.call(a.loads,b);-1!=d&&a.loads.splice(d,1);for(var e=0,f=b.linkSets.length;f>e;e++)d=k.call(b.linkSets[e].loads,b),-1!=d&&b.linkSets[e].loads.splice(d,1);b.linkSets.splice(0,b.linkSets.length)}function u(a,b,c){try{var e=b.execute()}catch(f){return void c(b,f)}return e&&e instanceof d?e:void c(b,new TypeError("Execution must define a Module instance"))}function v(a,b,c){var d=a._loader.importPromises;return d[b]=c.then(function(a){return d[b]=void 0,a},function(a){throw d[b]=void 0,a})}function w(a,b){var c=a.loader;if(a.loads.length)for(var d=a.loads.concat([]),e=0;e<d.length;e++){var f=d[e],g=u(a,f,b);if(!g)return;f.module={name:f.name,module:g},f.status="linked",t(c,f)}}function x(a,b){return b.module.module}function y(){}function z(){throw new TypeError("ES6 transpilation is only provided in the dev module loader build.")}var A=0;e.prototype={constructor:e,define:function(a,b,c){if(this._loader.importPromises[a])throw new TypeError("Module is already loading.");return v(this,a,new Promise(n({step:"translate",loader:this._loader,moduleName:a,moduleMetadata:c&&c.metadata||{},moduleSource:b,moduleAddress:c&&c.address})))},"delete":function(a){var b=this._loader;return delete b.importPromises[a],delete b.moduleRecords[a],b.modules[a]?delete b.modules[a]:!1},get:function(a){return this._loader.modules[a]?(y(this._loader.modules[a],[],this),this._loader.modules[a].module):void 0},has:function(a){return!!this._loader.modules[a]},"import":function(a,b,c){"object"==typeof b&&(b=b.name);var d=this;return Promise.resolve(d.normalize(a,b)).then(function(a){var b=d._loader;return b.modules[a]?(y(b.modules[a],[],b._loader),b.modules[a].module):b.importPromises[a]||v(d,a,g(b,a,{}).then(function(c){return delete b.importPromises[a],x(b,c)}))})},load:function(a){var b=this._loader;return b.modules[a]?Promise.resolve():b.importPromises[a]||v(this,a,new Promise(n({step:"locate",loader:b,moduleName:a,moduleMetadata:{},moduleSource:void 0,moduleAddress:void 0})).then(function(){delete b.importPromises[a]}))},module:function(a,b){var c=f();c.address=b&&b.address;var d=o(this._loader,c),e=Promise.resolve(a),g=this._loader,h=d.done.then(function(){return x(g,c)});return m(g,c,e),h},newModule:function(a){if("object"!=typeof a)throw new TypeError("Expected object");var b=new d,c=[];if(Object.getOwnPropertyNames&&null!=a)c=Object.getOwnPropertyNames(a);else for(var e in a)c.push(e);for(var f=0;f<c.length;f++)(function(c){j(b,c,{configurable:!1,enumerable:!0,get:function(){return a[c]},set:function(){throw new Error("Module exports cannot be changed externally.")}})})(c[f]);return Object.freeze&&Object.freeze(b),b},set:function(a,b){if(!(b instanceof d))throw new TypeError("Loader.set("+a+", module) must be a module");this._loader.modules[a]={module:b}},normalize:function(a,b,c){return a},locate:function(a){return a.name},fetch:function(a){},translate:function(a){return a.source},instantiate:function(a){}};var B=e.prototype.newModule}();var o;h.prototype=e.prototype,f.prototype=new h;var p=/^([^\/]+:\/\/|\/)/;f.prototype.normalize=function(a,b,c){return a=a.match(p)||"."==a[0]?new n(a,b||l).href:new n(g(this.paths,a)||a,l).href},f.prototype.locate=function(a){return a.name},f.prototype.instantiate=function(b){var d=this;return Promise.resolve(d.normalize(d.transpiler)).then(function(e){return b.address===e?{deps:[],execute:function(){var e=a.System,f=a.Reflect.Loader;return c("(function(require,exports,module){"+b.source+"})();",b.address,a),a.System=e,a.Reflect.Loader=f,d.newModule({"default":a[d.transpiler],__useDefault:!0})}}:void 0})};var q;if("undefined"!=typeof XMLHttpRequest)q=function(a,b,c,d){function e(){c(g.responseText)}function f(){d(new Error("XHR error"+(g.status?" ("+g.status+(g.statusText?" "+g.statusText:"")+")":"")+" loading "+a))}var g=new XMLHttpRequest,h=!0,i=!1;if(!("withCredentials"in g)){var j=/^(\w+:)?\/\/([^\/]+)/.exec(a);j&&(h=j[2]===window.location.host,j[1]&&(h&=j[1]===window.location.protocol))}h||"undefined"==typeof XDomainRequest||(g=new XDomainRequest,g.onload=e,g.onerror=f,g.ontimeout=f,g.onprogress=function(){},g.timeout=0,i=!0),g.onreadystatechange=function(){4===g.readyState&&(0==g.status?g.responseText?e():(g.addEventListener("error",f),g.addEventListener("load",e)):200===g.status?e():f())},g.open("GET",a,!0),g.setRequestHeader&&(g.setRequestHeader("Accept","application/x-es-module, */*"),b&&("string"==typeof b&&g.setRequestHeader("Authorization",b),g.withCredentials=!0)),i?setTimeout(function(){g.send()},0):g.send(null)};else if("undefined"!=typeof require&&"undefined"!=typeof process){var r;q=function(a,b,c,d){if("file:///"!=a.substr(0,8))throw new Error('Unable to fetch "'+a+'". Only file URLs of the form file:/// allowed running in Node.');return r=r||require("fs"),a=i?a.replace(/\//g,"\\").substr(8):a.substr(7),r.readFile(a,function(a,b){if(a)return d(a);var e=b+"";"\ufeff"===e[0]&&(e=e.substr(1)),c(e)})}}else{if("undefined"==typeof self||"undefined"==typeof self.fetch)throw new TypeError("No environment fetch API available.");q=function(a,b,c,d){var e={headers:{Accept:"application/x-es-module, */*"}};b&&("string"==typeof b&&(e.headers.Authorization=b),e.credentials="include"),fetch(a,e).then(function(a){if(a.ok)return a.text();throw new Error("Fetch error: "+a.status+" "+a.statusText)}).then(c,d)}}f.prototype.fetch=function(a){return new Promise(function(b,c){q(a.address,void 0,b,c)})},"object"==typeof exports&&(module.exports=e),a.Reflect=a.Reflect||{},a.Reflect.Loader=a.Reflect.Loader||e,a.Reflect.global=a.Reflect.global||a,a.LoaderPolyfill=e,o||(o=new f,o.constructor=f),"object"==typeof exports&&(module.exports=o),a.System=o}("undefined"!=typeof self?self:global);
//# sourceMappingURL=es6-module-loader.js.map

The text was updated successfully, but these errors were encountered:

guybedford · 2016-08-04T10:25:10Z

This project on its own doesn't support any transpilerless workflows, see SystemJS for examples of these built on top of this project.

xeaone · 2016-08-04T20:08:00Z

@guybedford

Thanks for the response. I am not griping just confused by some of the doc wording. I guess the read me is a little confusing then...

So It Is Not Optional
"If using ES6 syntax (optional), include traceur.js, babel.js or typescript.js in the page first then include es6-module-loader-dev.js:"

Possible Feature Request
It seems as though (to me) that EML should work without a transpiler. Like that is part of its purpose. I do understand now that this is not true. Although I can't imagine it would be that hard to modify it so that it defaults to work without transpilation. Have you guys thought about this possibility? And if I was to make a PR for something like this would it be accepted? So like including only the transpilation part that handles the exports and includes.

probins · 2016-08-04T20:22:42Z

this is a loader, not a parser. If the browser can parse the module syntax then you can use that syntax with it, but no browser has implemented that as yet. As browsers do not currently understand import/export, you have to transpile into something they do understand. You can do that directly with the loader/transpiler combination, but the transpiler has to load a large parser as it can't access the browser's parser, so this is not suitable for production.

probins · 2016-08-04T20:27:06Z

though looking at your code, index.js isn't a module anyway - it's not importing or exporting anything

xeaone · 2016-08-04T20:44:54Z

First Comment
I understand it is a loader but my point is that the loader does not work without a full transpiler.

So why not include only that part of the transpilater that only handles the import/export. That way there is no dependency on a transpiler.

As you can see in my above code it fails to work even without a transpiler.

You could also continue to leave the option for a full transpiler. But at least including a transpiler/parser for the import/export would be good.

Second Comment
Yes which is why I was confused as to why it was throwing an error.

probins · 2016-08-04T21:30:05Z

changing to a transpiler that only handles import/export is the plan for the new loader - see #463. This won't reduce the size overmuch, though, as the size comes from the parser.

Your code is trying to log the exports of a System.import on a file which doesn't export anything. I would imagine that's why it's failing.

xeaone · 2016-08-04T21:44:12Z

Ah yes that is exactly what I am talking about. I will read through it. Has there been any progress on this yet?

No I dont think that is why. Because in one of my test I did have imports in index.js. But I was not using a transpiler. Check the index.html no transpiler so that would have been the issue.

guybedford · 2016-08-13T08:36:57Z

@AlexanderElias perhaps have a look at https://github.com/ModuleLoader/node-es-module-loader or https://github.com/ModuleLoader/browser-es-module-loader.

guybedford closed this as completed Aug 13, 2016

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

EML not working without a transpiler #511

EML not working without a transpiler #511

xeaone commented Aug 3, 2016 •

edited

Loading

guybedford commented Aug 4, 2016

xeaone commented Aug 4, 2016 •

edited

Loading

probins commented Aug 4, 2016 •

edited

Loading

probins commented Aug 4, 2016

xeaone commented Aug 4, 2016 •

edited

Loading

probins commented Aug 4, 2016

xeaone commented Aug 4, 2016

guybedford commented Aug 13, 2016

EML not working without a transpiler #511

EML not working without a transpiler #511

Comments

xeaone commented Aug 3, 2016 • edited Loading

error

index.html

index.js

es6-module-loader.js

guybedford commented Aug 4, 2016

xeaone commented Aug 4, 2016 • edited Loading

probins commented Aug 4, 2016 • edited Loading

probins commented Aug 4, 2016

xeaone commented Aug 4, 2016 • edited Loading

probins commented Aug 4, 2016

xeaone commented Aug 4, 2016

guybedford commented Aug 13, 2016

xeaone commented Aug 3, 2016 •

edited

Loading

xeaone commented Aug 4, 2016 •

edited

Loading

probins commented Aug 4, 2016 •

edited

Loading

xeaone commented Aug 4, 2016 •

edited

Loading