vite vant按需引入编译的问题

Question

Vite 运行项目后报错

vite.config.js vant按需引入配置文件如下

styleImport({
        libs: [
            {
                libraryName: "vant",
                esModule: true,
                resolveStyle: (name) => `vant/es/${name}/style`,
            },
        ],
    }

编译后 报错文件不存在
D:/vue/node_modules/vant/lib/vant/es/toast/style'
我知道问题是多了一层 vant/lib/ 这个目录，可是这个是系统加上去的 这个怎么解决呢？

Answer 1

vite-plugin-style-import插件直接提供了vant的按需引入方法，建议可以尝试一下：https://github.com/vbenjs/vit...

import {
  createStyleImportPlugin,
  VantResolve
} from 'vite-plugin-style-import'

// ... 

plugins: [
    //...
    createStyleImportPlugin({
        resolves: [VantResolve()]
    })
]