How to use with npm and webpack?

[johnmee]

Similar to issue #98 I'm trying to work out how to use this with webpack directly from the npm package without much success.

require('grid-list') loads the gridList.js ok, but jquery.gridList.js is not loaded.

Following it up with require('grid-list/src/jquery.gridList.js') generates this error...

ERROR in ./\~/grid-list/src/jquery.gridList.js Module not found: Error: Cannot resolve module 'gridlist' in /home/john/project/node_modules/grid-list/src @ ./\~/grid-list/src/jquery.gridList.js 6:4-43

I've tried any number of incantations involving 'expose' and 'imports' without success. I confess I don't know the internals of what happens to do much more than take potshots in the dark.

I do get success if I resolve.alias the two files in the webpack.config.js. With those in place I can just require both aliases and everything is good to go.

resolve: {
   alias: {
       'gridlist': path.join(SRC_PATH, 'libs', 'gridList.js'),
       'jgridlist': path.join(SRC_PATH, 'libs', 'jquery.gridList.js')
   }
}

Just wondering if anyone has struck upon an incantation that will work without the aliases?

[andrei-picus-hs]

Myes, it seems like the jQuery plugin wasn't ever made for CommonJS. We could add module.exports and require calls, but we need to be careful with webpack because it understands both AMD and CommonJS and it will choose the first branch in that UMD boilerplate.

We could also make everything CommonJS and use webpack to publish a UMD package to npm/bower.

Leaving this open for ideas and/or PRs.

[RadValentin]

Just wanted to add that the defined module gridlist is incorrect, if it was set to grid-list, the actual name of the package and then it should get resolved ok for AMD without aliases.

[RadValentin]

@johnmee Can you give it a shot (see my previous comment) and submit a PR if it works for you?

[johnmee]

A variation to solve this for webpack, without setting up aliases.

window.GridList = require('grid-list/src/gridList.js');
require('imports?define=>false!grid-list/src/jquery.gridList.js');

[olee]

Why wasn't this fixed? Just changing the import from gridlist to grid-list should fix this problem....

[valentin-radulescu-hs]

@olee You're correct, feel free to open a PR and ping me for code review.

[valentin-radulescu-hs]

@olee fixed in #111