vite 库模式打包问题记录

650 阅读1分钟

使用vite构建组件库时主要有umd es cjs等几种模式

主要存在问题:组件单独打包问题、三方依赖问题

组件单独打包

因为要做单个组件的版本控制所以需要组件单独打包,可以通过配置多文件入口来实现

image.png

image.png

组件三方依赖问题

因为考虑到组件库的大小问题,所以未将组件库的三方依赖打包进组件库,所以需要将三方依赖排除

image.png

排除三方依赖后则需要从外部挂载三方依赖,umd cjs模式可以通过配置 output->globals 来实现。如果采用umd 的模式其依赖也是需要采用umd的模式引入

image.png

为了使组件更灵活,并且可以远程动态加载,所以采用了es模式,但是vite在es 包模式下的globals无效,所以外部依赖无法生效,通过采用rollup的plugins插件来提供外部全局的依赖

image.png