首页/ 学科题库/ vite/ 配置依赖与热更新
vite 实战教程

配置依赖与热更新

2026-05-23 约 5 分钟 juanwangdev

配置依赖与热更新

Vite 支持自定义配置文件位置和环境变量目录,配置文件变更时自动重启开发服务器。

configFile 配置

JavaScript
export default defineConfig({
  // 指定配置文件路径
  configFile: './config/vite.config.js'
})

envDir 配置

JavaScript
export default defineConfig({
  // 指定环境变量目录
  envDir: './config'
})

配置变更重启

修改 vite.config.js 后,Vite 自动重启开发服务器:

JavaScript
[vite] config changed, restarting server...

控制重启行为

JavaScript
export default defineConfig({
  server: {
    // 监听配置文件变更
    watch: {
      // 忽略特定文件
      ignored: ['!**/node_modules/**']
    }
  }
})

配置文件对比

选项说明默认值
configFile配置文件路径vite.config.js
envDir环境变量目录项目根目录

多配置文件场景

text
project/
├── vite.config.js       # 主配置
├── vite.base.config.js  # 基础配置
├── vite.dev.config.js   # 开发配置
└── vite.prod.config.js  # 生产配置
text
// vite.config.js 组合配置
import baseConfig from './vite.base.config'
import devConfig from './vite.dev.config'
import prodConfig from './vite.prod.config'

export default defineConfig(({ command }) => {
  return {
    ...baseConfig,
    ...(command === 'serve' ? devConfig : prodConfig)
  }
})

注意:配置文件变更自动重启是 Vite 内置行为,无需额外配置。

要点总结

  • configFile 指定配置文件位置
  • envDir 指定环境变量目录
  • 配置变更自动重启服务器
  • 支持组合多个配置文件
想在手机上练这篇的配套题目?
使用微信 卷王开发者小程序/App,首页顶部扫一扫识别下方二维码,即可解锁本讲对应真题与错题本。
了解产品 App
← 上一篇 条件配置与异步配置 下一篇 → 共享配置抽取