vitepree 使用使用图标库，打包报错

[guccihuiyuan]

• [ ] I'm sure this does not appear in the issue list of the repository

Basic Info

• Browser: firefox109.0
• Package Name And Version: @arco-design/web-vue@2.42.0

Steps to reproduce

import ArcoVueIcon from '@arco-design/web-vue/es/icon'

export default { ...DefaultTheme, enhanceApp(ctx: EnhanceAppContext) { DefaultTheme.enhanceApp(ctx) ctx.app.use(ArcoVueIcon) ctx.app.use(ArcoVue); ctx.app.use(KeyBladeProComponents) } }

build error: /Users/XX/Documents/code/keyblade/node_modules/.pnpm/@arco-design web-vue@2.42.0/node_modules/@arco-design/web-vue/es/icon/index.js:1 export { default } from "./arco-vue-icon.js"; ^^^^^^

SyntaxError: Unexpected token 'export'

[flsion]

@guccihuiyuan 我新建了一个 vitepress 的项目，并没有发现这个问题，可以升级 vitepress 的版本后再试试，这个报错是 vite 编译时出现的问题。

import DefaultTheme from 'vitepress/theme'
import { EnhanceAppContext } from 'vitepress';
import ArcoVue from '@arco-design/web-vue';
import ArcoVueIcon from '@arco-design/web-vue/es/icon';
import '@arco-design/web-vue/dist/arco.min.css';

export default {
  ...DefaultTheme,
  enhanceApp(ctx: EnhanceAppContext) {
    DefaultTheme.enhanceApp(ctx)
    ctx.app.use(ArcoVueIcon)
    ctx.app.use(ArcoVue);
  }
}

[guccihuiyuan]

使用 vitepress dev docs 启动是可以的，运行 vitepress build docs 打包的时候就会报错，我新建了一个vitepress项目 打包报错如下：

⠏ building client + server bundles... (!) Some chunks are larger than 500 kBs after minification. Consider:

• Using dynamic import() to code-split the application
• Use build.rollupOptions.output.manualChunks to improve chunking: https://rollupjs.org/configuration-options/#output-manualchunks
• Adjust chunk size limit for this warning via build.chunkSizeWarningLimit. ✓ building client + server bundles... (node:25763) Warning: To load an ES module, set "type": "module" in the package.json or use the .mjs extension. (Use node --trace-warnings ... to show where the warning was created) build error:

error Command failed with exit code 1. info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

进程已结束,退出代码1

[flowerofmycountry]

@guccihuiyuan 这是说你打包的体积太大 你可以以下2选1

1. 配置vite: build.chunkSizeWarningLimit增大限制体积
2. 手动分包，按需引入等手段缩小包体积

[guccihuiyuan]

上述粘贴错了，运行 vitepress build 应该报错信息是如下，你们也可以试一下

C:\Users\xx\Desktop\keyblade\node_modules.pnpm\@arco-design+web-vue@2.44.2\node_modules\@arco-design\web-vue\es\icon\index.js:1 export { default } from "./arco-vue-icon.js"; ^^^^^^

SyntaxError: Unexpected token 'export' at Object.compileFunction (node:vm:360:18) at wrapSafe (node:internal/modules/cjs/loader:1119:15) at Module._compile (node:internal/modules/cjs/loader:1155:27) at Object.Module._extensions..js (node:internal/modules/cjs/loader:1245:10) at Module.load (node:internal/modules/cjs/loader:1069:32) at Function.Module._load (node:internal/modules/cjs/loader:904:12) at ModuleWrap. (node:internal/modules/esm/translators:169:29) at ModuleJob.run (node:internal/modules/esm/module_job:193:25) at async Promise.all (index 0) at async ESMLoader.import (node:internal/modules/esm/loader:530:24)  ELIFECYCLE  Command failed with exit code 1.

[yaoyaochil]

+1!!!! 我也遇到了 请问 解决了吗

[yaoyaochil]

所有都是最新版本 也没用 使用element-plus没这个问题

[lrxCn]

我解决了

@arco-design/web-vue/es/icon

es 改为 lib

@arco-design/web-vue/lib/icon