futurescript icon indicating copy to clipboard operation
futurescript copied to clipboard

Gulp task? ES6 classes?

Open kristianmandrup opened this issue 8 years ago • 6 comments

Is there a gulp task for futurescript compilation? I'd like to use it with Polymer using a custom build pipeline, here the one for es6 via babel

I guess I'd have to create my own little gulp task for futurescript! :)

gulp-marko-compile could be a good baseline with this guide

Btw, can/does FutureScript classes compile to ES6 compatible classes with extends? Ie. can it generate something akin to this ES6 class based syntax for Polymer 2?

// Subclass existing element
class MyElementSubclass extends MyElement {
  static get is() { return 'my-element-subclass'; }
  static get properties() { return { /* properties metadata */ } }
  static get observers() { return [ /* observer descriptors */ ] }
  constructor() {
    super();
    ...
  }
  ...
}

// Register custom element definition using standard platform API
customElements.define(MyElementSubclass.is, MyElementSubclass);

kristianmandrup avatar Mar 05 '17 13:03 kristianmandrup

I created this gulp task for now. Haven't tested it yet.

https://github.com/kristianmandrup/gulp-futurejs-compile

Please review ;)

kristianmandrup avatar Mar 05 '17 14:03 kristianmandrup

FutureScript classes are compiled to ES6 class. But if you use Babel, it will not be ES6 classes. fus-ext classes are still using Babel (for compatibility reasons) so its classes are also not ES6 classes.

FutureScript's from is equivalent to ES6's extends. And it also supports static get. So it supports this kind of code. See the Class section in the manual.

zhanzhenzhen avatar Mar 05 '17 15:03 zhanzhenzhen

I'm not familiar with Polymer.

zhanzhenzhen avatar Mar 05 '17 15:03 zhanzhenzhen

Is there a gulp task for futurescript compilation?

FutureScript compiler itself isn't using any node modules like gulp. But if you want to know if you can compile FutureScript in a gulp task, yes you can use the fus command-line in it using child-process. For your "internal API" suggestion, OK I'll implement it in later versions (may be next version). Once implemented we can also use internal APIs.

zhanzhenzhen avatar Mar 05 '17 15:03 zhanzhenzhen

I already created a small gulp plugin for compiling FutureScript code as noted in my last comment. Will use it in my gulp build pipeline such as for Google Polymer 2 Web components.

Thanks for answering my questions about classes. Looks like I will have to first compile with FutureScript compiler then with Babel after?

kristianmandrup avatar Mar 05 '17 17:03 kristianmandrup

Yes, I suggest using Babel, particularly if the code will be run on browsers.

zhanzhenzhen avatar Mar 05 '17 17:03 zhanzhenzhen