Vite 构建React 项目中使用antd-pro components

Vite 构建React 项目中使用antd-pro components

vite.config.ts

import { UserConfigExport, ConfigEnv, defineConfig  } from 'vite'
import react from '@vitejs/plugin-react'
import * as path from 'path'
import viteEslint from 'vite-plugin-eslint'
import vitePluginImp from 'vite-plugin-imp'

// https://vitejs.dev/config/
const config = ({ command }: ConfigEnv): UserConfigExport => defineConfig({
  server: {
    proxy: {
      // 代理
    },
    // 端口
    port: 80
  },
  plugins: [
    react(),
    viteEslint({
      failOnError: false
    }),
    vitePluginImp({
      libList: [
        {
          libName: 'antd',
          style: (name) => `antd/es/${name}/style`,
        },
      ],
    }),
  ],
  resolve: {
    alias: [
      { find: /^~/, replacement: '' },
      { find: '@', replacement: path.resolve(__dirname, 'src') },
      { find: 'rc-picker/es/generate/moment', replacement: 'rc-picker/es/generate/dayjs'}
    ]
  },
  css: {
    preprocessorOptions: {
      less: {
        javascriptEnabled: true,
      },
    },
  },
})

export default config

antd 以及 antdPro 版本

"@ant-design/pro-components": "^1.1.10",
"antd": "4.22.8",
"vite": "^4.0.2",

版本如果不对会有诡异的报错