vite 项目搭建教程 [ vue3版 ]合集

vite 区分环境配置

import { defineConfig } from 'vite'

import viteBaseConfig from './vite.base.config'
import viteDevConfig from './vite.dev.config'
import viteProdConfig from './vite.prod.config'

// 策略模式(就是 Map 优化 ifelse)
const envResolver = {
  "build": () => {
    return { ...viteBaseConfig, ...viteProdConfig  }
  },
  "serve": () => {
    return { ...viteBaseConfig, ...viteDevConfig  }
  }
}

export default defineConfig(({ command }) => {
  return envResolve[command]()
})

TODO: vite 源码内置了很多 plugin 来实现 out of box，并且文档没有介绍，找到相应的源码和 plugin 手写一次，如

vite-plugin-html

awesome-vite 里的 plugin 源码学习