search

Dabolus / polymer3-webpack-starter-kit

Polymer 3 Starter Kit with Webpack
MIT License
55 stars 6 forks source link

Build transpiled with Babel isn't working #16

Closed Dabolus closed 6 years ago

Dabolus commented 6 years ago

Building the transpiled project using Babel will result into an error. There is most probably something wrong with the Babel configuration. Further investigation is needed.

Dabolus commented 6 years ago

Ok so, actually there are a bunch of problems with this issue.

  1. When transpiling to ES5, third party components are not transpiled. This will definitely cause some problems
  2. Custom elements ES5 adapter is not loaded, so the build just cannot work From webcomponentsjs repo:

    According to the spec, Custom Elements must be ES6 classes. 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. To work around this, load custom-elements-es5-adapter.js before declaring new Custom Elements.

Transpiling the bundle to es5 would cause the bundle size to increase, and loading the es5 adapter would add even more bytes to the mix. Taking into account the fact that ES6 is supported by pretty much any browser, I'm going to remove the transpilation option from the project, 'cause it's pretty much more trouble than it's worth. By the way, feel free to fork the project and any kind of transpilation that you want.

logicalphase commented 6 years ago

The biggest problem with ES6, and ES5 for that matter, is the inability of Googlebot to properly crawl the PWA. That's because Googlebot currently uses Chrome 41, which even with polyfills, gives up long before it can read semantic markup.

In our case, we're using prerender.io as a middleware to prerender a build copy to serve to search engine bots, and serving our ES6 goodness to modern browsers.

So, we won't miss compiled es5 versions anyway. I'm not building for .08% of the web anymore. Too much technical debt.

On Mar 13, 2018 1:49 AM, "Giorgio Garasto" notifications@github.com wrote:

Ok so, actually there are a bunch of problems with this issue.

  1. When transpiling to ES5, third party components are not transpiled. This will definitely cause some problems
  2. Custom elements ES5 adapter is not loaded, so the build just cannot work From webcomponentsjs repo:

According to the spec, 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. To work around this, load custom-elements-es5-adapter.js before declaring new Custom Elements.

Transpiling the bundle to es5 would cause the bundle size to increase, and loading the es5 adapter would add even more bytes to the mix. Taking into account the fact that ES6 is supported by pretty much any browser https://kangax.github.io/compat-table/es6/, I'm going to remove the transpilation option from the project, 'cause it's pretty much more trouble than it's worth. By the way, feel free to fork the project and any kind of transpilation that you want.

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/Dabolus/polymer3-webpack-starter-kit/issues/16#issuecomment-372564113, or mute the thread https://github.com/notifications/unsubscribe-auth/AYC27aScGDpaN5dc-bxW0ZiErqYGa9erks5td2v3gaJpZM4SkWO9 .

Dabolus commented 6 years ago

Oh, I completely forgot about the Googlebot crawling problem. Personally, I'm not building for that tiny percentage of the web either, but unfortunately many people might still want to do that because of the PWA crawling. Thanks for pointing that out, guess I'll have to complete the babel configuration then.

Dabolus commented 6 years ago

Everything should be finally fixed with #22 Hope that Googlebot will get updated one day, it's quite frustrating to be stuck to ES5 because of it.