Ant-design-vue cannot run in projects based on vite-ssr

[zhuchentong]

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

Version

2.1.3

Environment

window 10；chrome 90.0.4430.85；vue 3.0.8；vite 2.2.3

Reproduction link

https://github.com/zct1989/vite-ssr-demo

Steps to reproduce

npm run dev

What is expected?

正常运行

What is actually happening?

运行后报错如下：

Error [ERR_REQUIRE_ESM]: Must use import to load ES Module: /home/zhuchentong/Project/ssr-vue/node_modules/lodash-es/isPlainObject.js
require() of ES modules is not supported.
require() of /home/zhuchentong/Project/ssr-vue/node_modules/lodash-es/isPlainObject.js from /home/zhuchentong/Project/ssr-vue/node_modules/ant-design-vue/lib/_util/props-util/index.js is an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which defines all .js files in that package scope as ES modules.
Instead rename isPlainObject.js to end in .cjs, change the requiring code to use import(), or remove "type": "module" from /home/zhuchentong/Project/ssr-vue/node_modules/lodash-es/package.json.
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1080:13)
at Module.load (internal/modules/cjs/loader.js:928:32)
at Function.Module._load (internal/modules/cjs/loader.js:769:14)
at Module.require (internal/modules/cjs/loader.js:952:19)
at require (internal/modules/cjs/helpers.js:88:18)
at Object.<anonymous> (/home/zhuchentong/Project/ssr-vue/node_modules/ant-design-vue/lib/_util/props-util/index.js:28:45)
at Module._compile (internal/modules/cjs/loader.js:1063:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
at Module.load (internal/modules/cjs/loader.js:928:32)
at Function.Module._load (internal/modules/cjs/loader.js:769:14)

[zhuchentong]

#3983

[zhuchentong]

报错是通过require加载了lodash-es模块
在生成的cjs模块代码中引入了‘lodash-es’
建议应该在生成cjs模块时将 import * from 'lodash-es/*' 替换为import * from 'lodash/*'

[NoeyNoi]

+1

[lyh959550459]

+1024

[zhuchentong]

我现在是临时在项目中添加了postinstall脚本来解决

1. ant-design-vue/lib中require('lodash-es)
2. ant-design-vue/lib中require('@ant-design/icons-vue/ICON)

https://github.com/zct1989/antdv-es-patch

[shi-lai-mu]

+1 我在nuxtjs中也遇到了此问题

[github-actions]

Hello @zct1989. We totally like your proposal/feedback, welcome to send us a Pull Request for it. Please send your Pull Request to proper branch, fill the Pull Request Template here, provide changelog/TypeScript/documentation/test cases if needed and make sure CI passed, we will review it soon. We appreciate your effort in advance and looking forward to your contribution!

你好 @zct1989，我们完全同意你的提议/反馈，欢迎直接在此仓库创建一个 Pull Request 来解决这个问题。请将 Pull Request 发到正确的分支，务必填写 Pull Request 内的预设模板，提供改动所需相应的 changelog、TypeScript 定义、测试用例、文档等，并确保 CI 通过，我们会尽快进行 Review，提前感谢和期待您的贡献。

[github-actions]

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.