背景

由于公司内部组件升级后，为了加快开发速度，统一从webpack升级到vite，拉平组件的版本号，这边记录一下升级过程中遇到的问题。

问题记录

1. 低版本浏览器兼容处理，vite5支持浏览器chrome > 87版本
   安装npm i @vitejs/plugin-legacy -D
   在vite.config.js中配置

plugins[legacy({
    targets: ['chrome >= 70'], // 兼容到70版本
    additionalLegacyPolyfills: ['regenerator-runtime/runtime'],
    modernPolyfills: true,
}) ]

2. 组件资源冲突
   由于一些历史原因，存在组件冲突，在webpack打包时组件使用正常，vite打包后组件报错，具体是因为webpack使用时用require引入，vite更改为import引入，导致执行顺序出现问题。最后处理为统一删除自定义组件的依赖

3. 多入口打包问题
   使用vite-plugin-html处理多入口打包文件时，当线上配置ng转发路径和本地资源路径一致时，打包缺少相应资源。如线上资源入口为 "/public/style" "/public/img", 本地放置代码放置在public文件夹下面，打包后缺失相应资源引入