Dynamic modules are in very high demand nowadays. offers a great support for latter, providing limitless possibilities. FuseBox To get your interested right away I have prepared a neat , demo Before we get there, let me explain the internals of , and why the framework is best at dealing with dynamic modules. FuseBox The EcoSystem offers 100% compatible ecosystem for browsers. Every single file that you bundle will be accessible via FuseBox API. It does not modify your code in any way, hence it’s possible to play around, merge bundles, and modify them at runtime. FuseBox commonjs Let’s check an example. Open this angular2 . It’s powered by FuseBox. Open a developer console, and try to import this like so: todo-demo file FuseBox.import("./todo/todo-filter.pipe") You are getting the exports of todo/todo-filter.pipe. Now imagine how that can change your approach of coding. Unlike WebPack, FuseBox creates virtual files: _s.file("foo/bar.js", function(exports, require, module, __filename, __dirname){}); _s.file("foo/woo.js", function(exports, require, module, __filename, __dirname){}) It keeps the original structure within the bundle. Therefore fusing 2 bundles is going to be painless. It’s fun to create runtime plugins too. Access to any npm module Now, let’s go back to the playground I have intentionally included NodeJS’ and as you can see you can import it and use it as if you are running the code on server. path module, FuseBox.import("path") Now the fun part. Dynamic modules respect their location. Therefore a function is going to treat your imports accordingly. require FuseBox.dynamic("foo/moduleB.js", "") As if you have a folder “foo” with “moduleB.js” Now some magic. Let’s register index.js FuseBox.dynamic("foo/index.js", "module.exports = require('./*')") We are using a in this example. Not as if we had to. Just for fun. Require the folder like so: wildcard import FuseBox.import("./foo") It will trigger in that folder, just like in NodeJS. index.js Dynamic modules with FuseBox are fun. You can override modules, remove them, register new, create virtual packages and much much more for you to discover. Get to know ! FuseBox _FuseBox is a bundler/module loader that combines the power of webpack, JSPM and SystemJS. It takes 50–100ms to re…_hackernoon.com FuseBox — bundle your project within a fraction of a second If you like the project, don’t forget to star it on ! And of course, spread the word by clicking ♥ github Join our channel, we are active and very friendly! gitter

Too Long; Didn't Read

In your car, at home, or at work — Bosch technology shapes many areas of life.

FuseBox and the epicness of dynamic modules

Too Long; Didn't Read

Ivan Orlov

About Author

TOPICS

THIS ARTICLE WAS FEATURED IN...

FuseBox and the epicness of dynamic modules

Too Long; Didn't Read

Ivan Orlov

About Author

TOPICS

THIS ARTICLE WAS FEATURED IN...

RELATED STORIES