[vite] Internal server error: Failed to resolve import “C:/Users/8D/Desktop/vue3/qywx-client/node_mo

程序猿向前跑

已于 2023-02-17 11:42:45 修改

阅读量1w

点赞数 10

分类专栏： Vue 移动端文章标签： Vite Vant 样式导入配置解决方法

于 2022-06-27 20:30:51 首次发布

本文链接：https://blog.youkuaiyun.com/qq_46199553/article/details/125491323

版权

Vue 同时被 2 个专栏收录

64 篇文章

订阅专栏

移动端

44 篇文章

订阅专栏

在Vite项目中遇到导入Vant库样式失败的问题，通过在vite.config.ts配置styleImport，设置Vant的样式解析路径，成功解决了问题。具体解决方案是在配置中添加VantResolve，并指定libraryName和resolveStyle，使Vant各组件样式生效。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在这里插入图片描述
[vite] Internal server error: Failed to resolve import “C:/Users/8D/Desktop/vue3/qywx-client/node_modules/vant/lib/vant/es/button/style” from “src\plugins\vant.ts”. Does the f
ile exist?
这个问题该如何解决呢？
通过分析vant，最终可以通过以下方式进行解决

vite.config.ts里面进行修改

// 配置后，Vant各组件才生效
			styleImport({
				resolves: [VantResolve()],
				libs: [
					{
					  libraryName: 'vant',
					  esModule: true,
					  resolveStyle: (name) => `../es/${name}/style`
					}
				 ]
			}),