treycordova / nativejsx

JSX to native DOM API transpilation. :yellow_heart: <div> ⟹ document.createElement('div')!

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Offer an option to inline setAttributes and appendChildren.

treycordova opened this issue · comments

Requiring two <script> tags may be... cumbersome for some folks, and things like jsxdom-loader are great, but not everyone is using Webpack. jsxdom could probably benefit from an option that places setAttributes and appendChildren inline with the transpiled source.

For example:

var example = function() {
  // appendChildren is now inline!
  function appendChildren(element, children) {
    ...
  }
  var a = document.createElement('div');
  appendChildren(a, [1, 2, 3].map(function(number) {
    return function() {
      var b = document.createElement('span');
      appendChildren(b, number);
      return b;
    };
  }));
}();

Yes, this means we are repeating appendChildren and setAttributes for each JavaScript closure requiring either (or both). Possible option names: {prototypes: {inline: true}}, {prototypes: false}, or a verbose option like {inlineHelpers: true}.

Credit goes to @bjornbytes for this suggestion.