Greetings

Faced a problem or feature (I haven't figured it out yet) that when you reload a project from gulp & require to webpack (webpack3.4 & babel-loader). Modified import of modules and their challenge.

Earlier, I defined modules like this:

define(function(){ var obj={}; obj.foo = function(){ console.log("requireJS") }; return obj; }); 

and called so:

 define([ "require", "lib/module" ], function( require, module){ module.foo(); }); 

In the new project with the webpack, everything happens a little differently.

I define a module like this:

 export default function() { var obj = {}; obj.foo = ()=>{ console.log("Hello Friends!") }; return obj; } 

And import with a call happens so:

 import _module from "modules/module"; let module = _module(); module.foo(); 

In principle, it is possible to live, but is there a way to organize the code in such a way that the newly imported module is ready for work? example:

 import module from "modules/module"; module.foo(); 

    1 answer 1

    To do as I want, you can organize the module in the following way:

     "use strict"; /*jshint esversion: 6 */ function test(){ var obj = {}; obj.a = 123; obj.b = "fff"; obj.foo = ()=>{ console.log("Hello Friends!"); }; return obj; } export default test(); 

    Or so:

     export default { foo:{console.log("Hello Friends!")}, a:123, b:"fff" }; 

    And call as follows:

     import module from "modules/module"; test.foo();