gulp-define-module icon indicating copy to clipboard operation
gulp-define-module copied to clipboard

Using `hybrid` in browser

Open amadanmath opened this issue 9 years ago • 3 comments
trafficstars

I must be missing something, as I can't figure out how to use hybrid in a browser setting.

Following the instructions in the README,

{
  start: function() {},
  end: function() {},
  version: "1.0"
}

produces

(function(definition) {
  if (typeof exports === 'object') { module.exports = definition(); } // CommonJS 
  else if (typeof define === 'function' && define.amd) { define([], definition); } // AMD 
  else { definition(); } // Browser 
})(function() {
  return {
    start: function() {},
    end: function() {},
    version: "1.0"
  };
});

If I am not mistaken, if I then include this file with <script src="module.js">, it will just execute the object literal, which produces no effects, and leaves no way to access it again.

If this is indeed a problem and not just my lack of insight, it might be possible to improve this by either reusing the name option, or by making another option specifically for the browser case, in order to produce this code for the browser case when name is defined:

else { window["my_module_name"] = definition(); }

EDIT: This might also apply to plain.

amadanmath avatar Feb 26 '16 00:02 amadanmath

It's kind of designed to be used with the wrapper option in the browser case.

It also depends on what you're trying to do. The only reason to build a hybrid type module would be if you're building a library that you expect to be consumed by all these types (like jQuery).

In that case, you generally set window.x anyway.

I strongly recommend that you use something other than this module now, though. I'd point you toward babel.

wbyoung avatar Feb 26 '16 03:02 wbyoung

It also depends on what you're trying to do. The only reason to build a hybrid type module would be if you're building a library that you expect to be consumed by all these types (like jQuery).

I'm trying to write a library that can be used in both browser and node. I am imagining the use to be:

Node:

var module = require("module.js");
module.doStuff();

Browser:

<script src="module.js"></script>
<script>
  module.doStuff();
</script>

I believed that this is exactly the use case your plugin was developed for.

In that case, you generally set window.x anyway.

In the Node.js case, I do not want to set window.module.

It's kind of designed to be used with the wrapper option in the browser case.

If I understand correctly, wrapper would apply to the content in all three cases of hybrid, including the Node.js case; if so, this is not useful to me.

I strongly recommend that you use something other than this module now

Very well, I will use another module. I can't see how babel would help, though. Thank you for your time.

amadanmath avatar Feb 26 '16 04:02 amadanmath

I'm happy to accept a PR if it's backwards compatible with the existing functionality (in case anyone relies on it).

If you note, though, the AMD module is unnamed as well. Perhaps the name option should be extended to support named modules for the browser, too.

wbyoung avatar Feb 26 '16 21:02 wbyoung