ant-design-vue ant-design-vue takes a long time to cold start in the vite build tool

trafficstars

[x] I have searched the issues of this repository and believe that this is not a duplicate.

Version

3.2.6

Environment

window10 node：v16.13.0 vue：^3.2.37

Reproduction link

https://github.com/core-admin/ant-design-vue-vite-app-load-test.git

Steps to reproduce

在使用vite搭建项目时，引入ant-design-vue作为UI，在vite冷启动时，发现页面打开缓慢，使用vite提供的--debug参数，看了下启动耗时，发现主要的耗时时间都花费在了@ant-design/icons-vue的构建身份，平均每一个icons js文件的耗时为3000ms ，有个疑问，vite冷启动时，把@ant-design/icons-vue包中的全局文件做了一个预构建，是ant-design-vue底层在使用这个包时，全量引入了吗，没有批构建。

处理@ant-design/icons-vue耗时：平均时长在60s-80s左右

db13803b44065149511fe6775ce0564 2cb42981fc81bf0bf339307b8c9075e

对比了一下市面上其他几个UI，均在git仓库中进行了依赖安装，平均耗时如下：

naive-ui：

90f520d31086e3dc54842ad954ba8c1

@arco-design/web-vue：

8351e2dae762723a8fe9e33ebe75203

element-plus：

What is expected?

冷启动的的耗时缩减（想请教下作者，耗时久的原因大概在哪，有什么优化或者解决方法吗）

What is actually happening?

冷启动耗时太久

Jul 18 '22 15:07 core-admin

刚刚新建了一个nuxt3项目，使用了ant-design-vue，我只在app.vue里使用了Button组件，但是Network中显示所有的图标都被加载了

ant-design-vue: 3.2.10 nuxt3: 3.0.0-rc.6-27638947.92269dd

import { defineNuxtConfig } from 'nuxt'

export default defineNuxtConfig({
  build: {
    transpile: ['compute-scroll-into-view', 'ant-design-vue']
  }
})

<script lang="ts" setup>
import { Button } from 'ant-design-vue'
</script>

<template>
  <div>
    <Button>Button</Button>
  </div>
</template>

Jul 21 '22 02:07 lihanspace

这个时间确实太久了

Jul 21 '22 04:07 van-chin

今天偶然用StackBlitz这个在线开发者工具导入了一下项目，发现运行速度挺快，看了下启动的运行日志，发现在处理icon js 文件时耗比我本地测试时耗时减少很多，且没有在处理完上一个文件时等待下一个文件处理（可能太快看不出来是串行还是并行），StackBlitz使用的是npm进行的包管理工具安装的依赖。一开始我以为是厂商提供的服务器好，我自己本地再次尝试了一下，这次并未使用 pnpm 进行依赖安装，使用npm安装的依赖（使用pnpm安装依赖报错了，故转而使用npm），启动测试大概尝试了10几次（每次启动时我都把 node_modules/.vite 预构建的资源删除了）从命令执行到显示出页面资源完全下载完毕平均时长为 26秒

StackBlitz 在线项目启动日志处理文件耗时（基于npm安装）：