Closed ygsz closed 2 years ago
nestjs-vue3-ssr-pinia 模板引用 ant-design-vue 无法使用a-input-search组件就报错 Module not found: Error: Can't resolve 'ant-design-vue/lib/input-search' in 'D:\vue3\pc-shop-ssr\web\pages\index' Module not found: Error: Can't resolve 'ant-design-vue/lib/input-search/style' in 'D:\vue3\pc-shop-ssr\web\pages\index' 类似的组件如 a-input-search 、a-breadcrumb-item
可以正常使用ant-design-vue的a-input-search 、a-breadcrumb-item组件,组件名称与组件路径不同的组件
dependencies: ssr-core-vue3 6.2.13 ssr-hoc-vue3 6.2.0 ssr-server-utils 6.2.22 ant-design-vue:3.2.3
devDependencies: ssr 6.2.18 ssr-plugin-nestjs 6.2.10 ssr-plugin-vue3 6.2.23 ssr-types 6.2.11
import { InputSearch as AInputSearch } from 'ant-design-vue' <a-input-search placeholder="input search text" style="width: 200px" />
ant-design-vue库不是所有组件lib路径都是按引入名称来的,需要做映射转换
此问题与 ssr 框架无关,由于默认开启了 babel-plugin-import, 故无法使用全量引入模式语法。参考 ant-design-vue 导出规则,用以下语法引入 InputSearch
ssr
babel-plugin-import
ant-design-vue
InputSearch
import { Input } from 'ant-design-vue' const AInputSearch = Input.Search
详细描述你的问题
nestjs-vue3-ssr-pinia 模板引用 ant-design-vue 无法使用a-input-search组件就报错 Module not found: Error: Can't resolve 'ant-design-vue/lib/input-search' in 'D:\vue3\pc-shop-ssr\web\pages\index'
Module not found: Error: Can't resolve 'ant-design-vue/lib/input-search/style' in 'D:\vue3\pc-shop-ssr\web\pages\index' 类似的组件如 a-input-search 、a-breadcrumb-item
期望的结果
可以正常使用ant-design-vue的a-input-search 、a-breadcrumb-item组件,组件名称与组件路径不同的组件
当前使用的版本
dependencies: ssr-core-vue3 6.2.13 ssr-hoc-vue3 6.2.0 ssr-server-utils 6.2.22 ant-design-vue:3.2.3
devDependencies: ssr 6.2.18 ssr-plugin-nestjs 6.2.10 ssr-plugin-vue3 6.2.23 ssr-types 6.2.11
复现仓库地址
你本人对问题可能的原因判断(如果你能大概判断的话)
ant-design-vue库不是所有组件lib路径都是按引入名称来的,需要做映射转换