在 nuxt3 中使用 a-form-item, build 后运行, 报错 Cannot find module '/lodash-es/cloneDeep'

[gengarwang]

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

Version

3.2.20

Environment

mac v12.6.3、node v18.15.0、Chrome v100

Reproduction link

https://github.com/FreeDrifter/issues/tree/main/antd-nuxt3

Steps to reproduce

1. pnpm install
2. pnpm dev (启动后, 打开页面. 运行无问题)
3. pnpm build
4. pnpm preview (启动后, 打开页面. 服务报错)

What is expected?

build 后, 启动页面, 服务器渲染不报错, 无问题

What is actually happening?

报错如下:

[nuxt] [request error] [unhandled] [500] Cannot find module '/Users/xxxx/test/.output/server/node_modules/lodash-es/cloneDeep' imported from /Users/xxxx/test/.output/server/chunks/app/server.mjs
Did you mean to import lodash-es/cloneDeep.js?
at new NodeError (node:internal/errors:399:5)
at finalizeResolution (node:internal/modules/esm/resolve:326:11)
at moduleResolve (node:internal/modules/esm/resolve:945:10)
at defaultResolve (node:internal/modules/esm/resolve:1153:11)
at nextResolve (node:internal/modules/esm/loader:163:28)
at ESMLoader.resolve (node:internal/modules/esm/loader:838:30)
at ESMLoader.getModuleJob (node:internal/modules/esm/loader:424:18)
at ModuleWrap. (node:internal/modules/esm/module_job:77:40)
at link (node:internal/modules/esm/module_job:76:36)

ant-design-vue FormItem 代码:
链接: https://github.com/vueComponent/ant-design-vue/blob/main/components/form/FormItem.tsx
相关代码: import cloneDeep from 'lodash-es/cloneDeep';
但 node.js 不支持不带后缀的引入, 且 lodash-es 库的 package.json 中未定义 exports

猜测, 代码应修改为 import { cloneDeep } from 'lodash-es'

[gengarwang]

？？？

[CCherry07]

我来看一下

[CCherry07]

@freedrifter ok，我知道你要怎么做了

我们推荐使用 @ant-design-vue/nuxt 来支持按需引入组件，以对服务端渲染更好的支持

export default defineNuxtConfig({
  devtools: { enabled: true },
  imports: {
    dirs: ['./utils']
  },
  modules: [
    '@ant-design-vue/nuxt'
  ],
})

不再使用 unplugin-vue-components

[gengarwang]

@CCherry07
@ant-design-vue/nuxt 是否只支持 ant-design-vue4 ?
如果是的话, ant-design-vue4 有个致命的缺点, SSR 加载时, 闪一下才能加载到正常样式

#6659

[CCherry07]

antdv3，也是支持的，已经有pr在处理antdv4这个问题

#6713

[github-actions]

This issue is stale because it has been open 60 days with no activity. Remove stale label or comment or this will be closed in 7 days

[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.