在做Vue3+Vite+Vant 项目过程中,遇到了[vite] Internal server error: Failed to resolve import报错
这一步是在项目的vite.config.js
文件中, 配置按需引入插件 vite-plugin-style-import 报错
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import styleImport, { VantResolve } from 'vite-plugin-style-import';
// https://vitejs.dev/config/
export default defineConfig({
plugins: [
vue(),
styleImport({
resolves: [VantResolve()],
}),
],
server: {
port: 3000,
}
})
启动项目报错
解决方法:
在vite.config.js
文件中的 styleImport插件
里面加上 libs
代码块:
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import styleImport, { VantResolve } from 'vite-plugin-style-import';
// https://vitejs.dev/config/
export default defineConfig({
plugins: [
vue(),
styleImport({
resolves: [VantResolve()],
libs: [
{
libraryName: 'vant',
esModule: true,
resolveStyle: name => `../es/${name}/style`
}
]
}),
],
server: {
port: 3000,
}
})