Ag-grid not working with angular and webpack - angularjs

Question

I am trying to get ag-grid to work with webpack.
I've done the standard thing by adding ag-grid through npm and added the reference to webpack.config by doing this:
resolve: {
alias: {"ag-grid" : path.resolve(__dirname, "./node_modules/ag-grid/dist/ag-grid.js")
}
The file gets resolved and loaded into the index file just fine. And I've done the following for angular.
angular.module("cs-app", [require("ag-grid").name]);
Webpack also resolves this file and gets included and loaded up but when I run the app I get the following error.
[$injector:modulerr] Failed to instantiate module angularGridGlobalFunction due to:
[$injector:nomod] Module 'angularGridGlobalFunction' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
I can't find the name angularGridGlobalFunction in ag-grid.js but when I comment out the reference to ag-grid then the app works just fine.
So anyone suggestions?

Answer 1

so ag-grid does not need aliasing in the webpack.config.js so I removed that and aliased the node_modules folder.
resolve : {
alias : {
// bind version of jquery-ui
"jquery-ui" : "jquery-ui/jquery-ui.js",
// bind to modules;
modules : path.join(__dirname, "node_modules"),
components : path.join(__dirname, "components"),
libs : path.join(__dirname, "bower_components"),
}
},
I add at the top of my module file
require("ag-grid");
require("modules/ag-grid/dist/ag-grid.css");
require("modules/ag-grid/dist/theme-fresh.css");
And changed the angular module reference
angular.module("cs-app", ["agGrid"]);
And whatta you know it worked
If you like it hit me with an upvote! Thanks

Answer 2

Here is what worked for me, first the solution:
npm install imports-loader --save-dev
Then in my code, add this to the loaders array in the webpack-config.js
{ test: require.resolve("ag-grid"), loader: "imports?importedAngular=angular" },
then the problem:
The ag-grid in npm in npm is not "npm ready", there is no indication in the code that ag-grid requires("angular"). So webpack is free to put it anywhere in the file, and load it any time. In my case, when ag-grid loaded, angular and window.angular were undefined, so ag-grid loaded before angular. The ag-grid checks that window.angular is defined before it creates the module, so the module is never created.
The steps above add a shim, to always load angular before ag-grid.