Vite 配置指南：base 选项详解

本文详细介绍 Vite 配置中的 base 选项，这是控制项目公共基础路径的关键配置，适用于开发和生产环境。

base 配置详解

基本属性

• 类型: string
• 默认值: /
• 相关配置: server.origin

功能说明

base 用于指定项目在开发或生产环境下的公共基础路径。有效的配置值包括：

• 绝对 URL 路径名，例如 /foo/
• 完整 URL，例如 https://bar.com/foo/（开发环境下 origin 部分不会被使用，效果等同于 /foo/）
• 空字符串或 ./（用于嵌入式部署场景）

使用场景

1. 子路径部署

当应用需要部署在域名的子路径下时：

// vite.config.js
export default defineConfig({
  base: '/my-app/',
})

此时，所有资源引用都会自动添加 /my-app/ 前缀。

2. CDN 部署

使用 CDN 加速静态资源时：

export default defineConfig({
  base: 'https://cdn.example.com/assets/',
})

3. 嵌入式部署

对于需要嵌入到其他页面的应用：

export default defineConfig({
  base: './',
})

使用相对路径 ./ 可以确保资源引用相对于当前页面路径解析。

注意事项

1. 路径格式: 确保 base 以斜杠 / 开头和结尾（除非是 ./ 或空字符串）
2. 开发环境: 完整 URL 的 origin 部分在开发时会被忽略
3. 资源引用: 配置后，Vite 会自动处理 HTML、CSS、JS 中的资源路径

相关文档

更多详细信息请参考 Public Base Path 指南。

本文内容整理自 Vite 官方文档 Shared Options 章节。

在 AI 技术快速迭代的今天，保持持续学习的能力比掌握任何特定的技术都更重要。理解底层原理可以帮助你在遇到新技术时更快地上手，可以在不同的技术方案之间做出更明智的选择。建议开发者建立自己的技术框架，而不是追逐每一个新的工具和框架。实践是最好的学习方式，在真实项目中应用新学到的技术，遇到问题并解决，这种经历比任何教程都更有价值。定期整理和复盘也是很好的习惯。将学到的知识归档整理，形成自己的知识库。当需要用到某个技术时，可以直接从自己的知识库中找到相关的参考，而不是从零开始搜索。

技术的价值不在于它有多前沿，而在于它能在多大程度上解决实际问题。AI 技术的快速迭代不是用来追赶的潮流，而是用来解决业务痛点的工具箱。在实际应用中，有时候简单的方案反而最有效。一个 RAG 系统用了最复杂的检索策略但文档处理没做好，效果不如一个文档处理完善但检索策略简单的系统。一个 Agent 系统用了最贵的模型但 prompt 设计粗糙，效果不如一个精心设计 prompt 的普通模型。建议在追求技术先进性之前，先把基础工作做扎实。文档清洗、数据标注、评测体系、监控告警，这些看似基础的工作，往往是决定 AI 项目成败的关键。