vite.config.ts配置之自动导入element-puls方式

npm install -D unplugin-vue-components unplugin-auto-import

// vite.config.ts
import { defineConfig } from 'vite'
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
export default defineConfig({
  // ...
  plugins: [
    // ...
    AutoImport({
      resolvers: [ElementPlusResolver()],
    }),
    Components({
      resolvers: [ElementPlusResolver()],
    }),
  ],
})

"include": [
    "src/**/*.ts",
    "src/**/*.d.ts",
    "src/**/*.tsx",
    "src/**/*.vue",
    "src/style/blackTheme.scss"
  ]

    AutoImport({
      resolvers: [ElementPlusResolver()],
      dts: "src/auto-imports.d.ts",
      include: [
        /\.[tj]sx?$/, // .ts, .tsx, .js, .jsx
        /\.vue$/,
        /\.vue\?vue/, // .vue
        /\.md$/, // .md
      ],
      vueTemplate: true,
      imports: [
        "vue",
        "vue-router",
        "vue/macros",
        // custom
        {
          "@vueuse/core": [
            // named imports
            "useMouse", // import { useMouse } from '@vueuse/core',
            // alias
            ["useFetch", "useMyFetch"], // import { useFetch as useMyFetch } from '@vueuse/core',
          ],
          axios: [
            // default imports
            ["default", "axios"], // import { default as axios } from 'axios',
          ],
        },
      ],
    }),
    Components({
      // allow auto load markdown components under `./src/components/`
      extensions: ["vue", "md"],
      // allow auto import and register components used in markdown
      include: [/\.vue$/, /\.tsx$/, /\.vue\?vue/, /\.md$/],
      resolvers: [ElementPlusResolver()],
      dts: "src/components.d.ts",
    }),

vue({
      include: [/\.vue$/, /\.md$/],
      // 可以使用$ref
      reactivityTransform: true,
    }),

 import {
  createStyleImportPlugin,
  ElementPlusResolve,
} from "vite-plugin-style-import";
// 解决message和notification引入不生效问题
    createStyleImportPlugin({
      resolves: [ElementPlusResolve()],
    }),

createHtmlPlugin({
      inject: {
        data: {
          title: "vite+vue3+ts",
          description: "系统",
          version: "1.0.1",
        },
      },
    }),

<title><%-title%></title>

css: {
    preprocessorOptions: {
      // less: {
      // 全局添加less
      // additionalData: `@import '@/assets/styles/common/var.less';`,
      // javascriptEnabled: true,
      // },
    },
  },

 /** Vite 2.6.x 以上需要配置 minify: "terser", terserOptions 才能生效 */
    minify: "terser",
    /** 在打包代码时移除 console.log、debugger 和 注释 */
    terserOptions: {
      //打包后移除console和注释
      compress: {
        drop_console: false,
        drop_debugger: true,
        pure_funcs: ["console.log"],
      },
      format: {
        /** 删除注释 */
        comments: false,
      },
    },