Question

我正在使用vue-cli 3构建软件包并使用yarn作为软件包管理器来开发monorepo。

我有两个软件包，flexgrid（UI组件）和datatable（从服务器加载数据并将其显示在flexgrid中的应用程序）。

问题是，vue-cli添加了core-js（以及其他）polyfill，因此在datatables的最后一捆中，我实际上将某些polyfill捆绑了两次。

这是package.json设置：

Flexgrid：

"name": "@namespace/flexgrid",
"version": "0.2.0",
"private": true,
"module": "./dist/flexgrid.common.js",
"main": "./dist/flexgrid.umd.min.js",
...

构建命令如下："build": "vue-cli-service build --formats umd-min,commonjs --target lib ./src/main.ts --report"。

数据表：

"name": "@namespace/datatable",
"version": "0.2.0",
"private": true,
"module": "./dist/datatable.common.js",
"main": "./dist/datatable.umd.min.js",
...
"dependencies": {
  "@namespace/flexgrid": "^0.2.0",
  ...
}, ...

构建命令如下："build": "vue-cli-service build --formats umd-min --target lib src/main.ts --report"。

flexgrid.common.js以完整大小存在于最终捆绑中，因此不会摇摇欲坠或重复数据消除。

我发现一个解决方法是在"module": "./src/main.ts"项目中使用flexgrid。当我这样做时，显然我不再可以使用相对于根的导入（即@/components/FlexGrid.vue），因为@解析为cwd而不是flexgrid根。

所以我的问题是：如何正确设置此monorepo / vue-cli项目以减小捆绑包的大小？

VUE CLI纱线Monorepo束尺寸

0 个答案: