vue2 中使用 Ag-grid-enterprise 企业版
文章目录
- 问题
- Vue2 引入企业版不生效
- npm run dev 时卡住了
- 94% after seal 卡在这里了
- 测试打包
- 源 git 解决方案记录
问题
我想用企业版的树状表格
Vue2 引入企业版不生效
编译引入
// vue.config.js
module.exports = {transpileDependencies: ["ag-grid-enterprise",],
}
这句话的意思是告诉 Vue CLI 在构建过程中对 ag-grid-enterprise 模块进行转译（transpile）。默认情况下，Vue CLI 会跳过对 node_modules 中的依赖项进行转译，以提高构建性能。然而，有些库可能包含现代 JavaScript 语法，这些语法在某些环境中（如旧版浏览器）可能不被支持。通过将这些库添加到 transpileDependencies 数组中，可以确保它们在构建过程中被转译为兼容的代码。
npm run dev 时卡住了
63% building 558/624 modules 66 active ...ules/sortablejs/modular/sortable.esm.js[BABEL]
Note: The code generator has deoptimised the styling of
/Users/wangzhongqing/Desktop/WorkProject/hongfang_v1/node_modules/ag-grid-enterprise/dist/ag-grid-enterprise.auto.esm.js
as it exceeds the max of 500KB.
你遇到的问题是 Webpack 在构建过程中对 ag-grid-enterprise 模块进行了去优化处理，因为该模块的大小超过了 500KB。这通常不会影响功能，但可能会导致构建时间增加或性能下降。
以下是一些可能的解决方案和建议：
调整编译
// babel.config.js
module.exports = {presets: [['@vue/app', {// 允许更大的模块大小compact: false}]]
};
不过，我放开之后，dev 的时候巨慢，
94% after seal 卡在这里了
先不要引入 import 'ag-grid-enterprise';，等项目运行之后再引入
测试打包
打包是可以打包的，但是打包速度非常慢，而且体积很大，也可以运行，等待研究并优化
源 git 解决方案记录
- https://github.com/ag-grid/ag-grid/issues/5892