Using Webpack in place of requirejs?

[Gary]

Hi,

Wondering if I could get any pointers on using webpack (http://webpack.github.io/) instead of requirejs for a Durandal project.

I realize Durandal is built around requirejs, and this may involve a fork of Durandal, but curious how "pluggable" the module/loading system is.

Related to this - what is the idea for module loading in Durandal Nextgen?  

Thanks,

Gary

[Rob Eisenberg]

It would require alterations to the system module for the current version of Durandal. If those alterations are relatively simple and streamlined, I would take a pull request to add it into the next release.

In terms of the next gen version of Durandal, it has a Loader abstraction for which there can be multiple implementations. The current plan is to provide RequireJS and system.js loaders out of the box. Anyone who wants to use a different loader would just need to implement the interface themselves. So, in the new version, it's designed to be more easily extensible.

--
You received this message because you are subscribed to the Google Groups "DurandalJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email to durandaljs+...@googlegroups.com.
Visit this group at http://groups.google.com/group/durandaljs.
To view this discussion on the web visit https://groups.google.com/d/msgid/durandaljs/2de99fe7-6714-4d59-9492-9397e9e5382d%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

--

Rob Eisenberg,

President - Blue Spire
www.durandaljs.com

[Gary]

Thanks for the pointers, Rob; will take a look.   Welcome back as well!

[Rob Eisenberg]

Thank you. Tis good to be here :)

[Gary]

Brief update on this for the curious: 

Webpack is an app bundler that can be used as a direct replacement for requirejs in many cases (it parses and handles require(...) calls).

The main benefit over requirejs is greatly simplifying the concat and minification to a single app file, very nice module loaders, and transparent commonjs/AMD/global/etc support.

It does a pretty amazing job generating a combined bundle by finding requires and automatically generating (some) dynamic require patterns.

It almost works well with Durandal 2.x out-of-the-box , but runs into problems due to Durandal's use of requires with dynamic module IDs for views, etc:

app.setRoot('Shell', 'entrance');
...
router.map([
    { route: '', title: 'Home Page', moduleId: 'home/Home' }
]);

etc.

Durandal isn't doing anything wrong here - it's currently just a bit difficult to have webpack automatically understand all the require calls needed to minify a Durandal app, at least without a lot of manual configuration of what modules to include in the bundle.

Since my interest in this was to eliminate the manual configuration we are doing with r.js, Grunt, etc, I think I will hold off on this until Durandal nextgen comes out and take another look then.

Thanks,

Gary

On Tuesday, December 9, 2014 7:30:52 PM UTC-8, EisenbergEffect wrote:

[Craig Michael Thompson]

Hi Gary,

I've recently started looking into this myself recently and decided to post a blog guide about it, as it requires some changes to how you write the application.

Code is here: http://Craga89.github.io/durandal-webpack

Guide is here: http://blog.craigsworks.com/durandal-and-webpack-introduction/

Cheers

[Gary Thomas]

This is terrific Craig!  Very nice work!

I was a bit lazy to follow through with this as you have, thanks for the code and writeup; I'll try out the code this evening.

Thanks again,

Gary