Ag-grid不能和angular和webpack一起工作

我正在试图让ag-grid与webpack一起工作。 我已经完成了标准的事情，通过添加通过npm的网格，并添加了引用webpack.config这样做：

resolve: { alias: {"ag-grid" : path.resolve(__dirname, "./node_modules/ag-grid/dist/ag-grid.js") } 

该文件得到解决，并加载到索引文件就好了。 我做了以下的angular度。

 angular.module("cs-app", [require("ag-grid").name]); 

Webpack也parsing这个文件，并被包含并加载，但是当我运行应用程序，我得到以下错误。

 [$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. 

我无法在ag-grid.js中find名称angularGridGlobalFunction，但是当我注释掉对ag-grid的引用时，该应用程序工作得很好。

所以有人build议？

Answer 1

所以ag-grid在webpack.config.js中不需要别名，所以我删除了它，并为node_modules文件夹添加了别名。

 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"), } }, 

我添加在我的模块文件的顶部

 require("ag-grid"); require("modules/ag-grid/dist/ag-grid.css"); require("modules/ag-grid/dist/theme-fresh.css"); 

并改变了angular度模块的参考

 angular.module("cs-app", ["agGrid"]); 

而你知道它的工作

如果你喜欢它打了我upvote！ 谢谢

Answer 2

这是对我有用的，首先解决scheme：

 npm install imports-loader --save-dev 

然后在我的代码中，将其添加到webpack-config.js中的loaders数组中

 { test: require.resolve("ag-grid"), loader: "imports?importedAngular=angular" }, 

那么问题是：

npm中的ag-grid不是“npm ready”，在代码中没有指示ag-grid需要（“angular度”）。 所以webpack可以随意放在文件的任何位置，随时加载。 在我的情况下，当ag网格加载，angular度和window.angular是未定义的，所以ag网格angular度之前加载。 ag-grid会在创build模块之前检查window.angular是否已定义，因此不会创build该模块。

上面的步骤添加一个垫片，始终加载angular网格之前。