Webpack构建项目中ag-grid-enterprise企业方法无法使用，求解决办法

我之前也碰到过一模一样的问题，大概率是导入方式不对或者依赖配置有坑，下面给你一步步拆解解决办法：

1. 先把依赖包调整正确 #

AG Grid现在的包结构已经拆分了，旧的ag-grid包不再维护，得换成官方推荐的社区版+企业版组合：

# 先卸载旧的ag-grid包（如果之前装过的话）
npm uninstall ag-grid
# 安装匹配版本的社区版和企业版
npm install ag-grid-community ag-grid-enterprise --save

⚠️ 划重点：社区版和企业版的版本号必须完全一致，不然会出现功能不兼容的情况，你可以去package.json里核对两个包的版本。

2. 修改导入方式，让企业版功能正确注册 #

你之前的导入没有把企业版功能挂载到核心AG Grid对象上，换成下面的写法试试：

// 先导入社区版核心模块
import * as agGrid from 'ag-grid-community';
// 导入企业版，它会自动向社区版注册所有企业级功能
import 'ag-grid-enterprise';

如果习惯用ES模块的导入方式，也可以这么写：

import { Grid } from 'ag-grid-community';
import 'ag-grid-enterprise';

这样企业版的专属方法就会被正确加载到AG Grid实例里了。

3. 调整Webpack配置，避免Tree-shaking误删代码 #

如果你的Webpack用了生产模式，可能会把AG Grid Enterprise的代码当成“无用代码”摇掉（因为它的导入是副作用操作，没有直接导出变量）。你需要在Webpack配置里加个例外：

module.exports = {
  // ...其他配置项
  optimization: {
    sideEffects: [
      "ag-grid-enterprise/**/*.js"
    ]
  }
};

告诉Webpack：AG Grid Enterprise的代码是有副作用的，别随便删它。

4. 验证功能是否生效 #

你可以调用一个企业版独有的功能来测试，比如开启透视表模式：

const gridOptions = {
  columnDefs: [/* 你的列定义 */],
  pivotMode: true, // 这个是企业版专属功能
  // ...其他表格配置
};

// 初始化表格
new agGrid.Grid(document.getElementById('myGrid'), gridOptions);

如果透视表能正常工作，说明企业版功能已经成功加载了。

内容的提问来源于stack exchange，提问作者user3712353