我的vite.config.js基础配置 --记录

import { defineConfig } from "vite";
import { resolve } from "path";
import { terser } from "rollup-plugin-terser";
import vue from "@vitejs/plugin-vue";
import AutoImport from "unplugin-auto-import/vite";
import Components from "unplugin-vue-components/vite";

// less中js语句转换
import lessToJS from "less-vars-to-js";
import fs from "fs";

const themeLessPath = resolve(__dirname, "./src/theme/index.less");
const modifyVars = lessToJS(fs.readFileSync(themeLessPath, "utf8"));

// https://vitejs.dev/config/
export default defineConfig({
  base: "/", // 开发或生产环境服务的公共基础路径
  define: {
    // 环境变量配置
    "process.env": {
      NODE_ENV: JSON.stringify(process.env.NODE_ENV || "development"),
    },
  },
  server: {
    host: true, // 监听所有地址
    port: 9857, // 端口
    https: false, // 是否开启 https
    hmr: true, // 是否开启自动刷新
    // open: true, // 是否开启自动打开浏览器
  },

  build: {
    outDir: "build", // 打包文件的输出目录
    assetsDir: "static", // 静态资源的存放目录
    sourcemap: false, // 不生成源映射文件
    assetsInlineLimit: 4096, // 小于 4KB 的资源将会内联到输出的 HTML 文件中
    chunkSizeWarningLimit: 500, // 当 chunk 文件大小超过 500KB 时，输出警告
    minify: "esbuild", // 是否开启压缩可选值：'terser' | 'esbuild'
    rollupOptions: {
      plugins: [
        terser({
          // 删除 console
          compress: {
            drop_console: true,
          },
        }),
      ],
    },
  },
  css: {
    preprocessorOptions: {
      less: {
        modifyVars,
        javascriptEnabled: true,
      },
    },
  },
  resolve: {
    alias: {
      "@": resolve("src/"),
    },

    extensions: [".mjs", ".js", ".ts", ".jsx", ".tsx", ".json", ".vue"], // 忽略后缀
  },
  plugins: [
    vue(),
    AutoImport({
      // 自动导入 Vue 相关函数，如：ref, reactive, toRef 等
      imports: ["vue"],
      eslintrc: {
        enabled: false, // 1、改为true用于生成eslint配置。2、生成后改回false，避免重复生成消耗
      },
    }),
    Components({
      // 指定自动导入的组件位置，默认是 src/components
      dirs: ["src/components"],
    }),
  ],
  optimizeDeps: {
    force: true, // 强制进行依赖预构建
  },
});