Vite2 按需引入

Vite2 按需引入 Ant Design Vue 與 element-plus 還有 vant UI框架

這兩個文檔內按需引入這塊，看不太懂於是在github issues上找了一下
目前為止比較好的解決辦法，推薦第一種

第一種

注意⚠️有個問題：如果不引入所有組件的css，部分組件樣式不全。
https://github.com/onebay/vite-plugin-imp
css也可以按需引入

# ./vite.config.js 文件

import vue from '@vitejs/plugin-vue'
import vitePluginImp from 'vite-plugin-imp'

/**
 * https://vitejs.dev/config/
 * @type {import('vite').UserConfig}
 */
export default {
    plugins: [
        vue(),
        vitePluginImp({
            libList: [
                {
                    libName: 'vant',
                    style(name) {
                        if (/CompWithoutStyleFile/i.test(name)) {
                            // This will not import any style file
                            return false
                        }
                        return `vant/es/${name}/index.css`
                    }
                },
                {
                    libName: 'ant-design-vue',
                    style(name) {
                        if (/popconfirm/.test(name)) {
                            // support multiple style file path to import
                            return [
                                'ant-design-vue/es/button/style/index.css',
                                'ant-design-vue/es/popover/style/index.css'
                            ]
                        }
                        return `ant-design-vue/es/${name}/style/index.css`
                    }
                },
                {
                    libName: 'element-plus',
                    style: (name) => {
                        return `element-plus/lib/theme-chalk/${name}.css`
                    }
                }
            ]
        })]
}

# ./src/main.js 文件
import { createApp } from 'vue'
import App from './App.vue'

import { Button } from 'ant-design-vue';

const app = createApp(App);

const antd = [
    Button,
]
antd.forEach(plugin => {
    app.use(plugin)
})

app.use(Button);
app.mount('#app')

第二種

css不會按需引入
https://github.com/wingsico/vite-babel-plugin

引入button

全量引入