vite配置讲解

Vite 的配置文件通常被命名为 vite.config.js，它是一个 Node.js 模块，导出一个对象，包含了各种配置选项。以下是一些常见的配置选项：

　　

• mode：指定应用程序的模式，可以是开发模式（'development'）或生产模式（'production'）。在开发模式下，Vite 会启用一些调试工具和优化，而在生产模式下，会进行代码压缩和优化。

• resolve：用于配置模块解析行为的选项。可以指定别名（alias）来简化导入路径，指定扩展名（extensions）来处理不同类型的模块，还可以配置模块的查找顺序（mainFields）等。

• root：指定项目的根目录，默认为当前工作目录。

• base：指定在构建生产版本时，HTML 文件所在的基础路径。默认情况下，它是一个相对路径（'./'），可以根据实际需求进行更改。

• publicDir：指定公共资源文件夹的路径，默认为 'public'。在构建过程中，该文件夹中的内容将被复制到输出目录。

• build：构建相关的配置选项。

  • target：指定构建的目标浏览器环境，默认为 'modules'，表示构建为支持原生 ES 模块的浏览器。可以设置为 'esnext' 或 'browserslist'，以根据项目需求选择构建目标。

  • outDir：指定构建输出目录，默认为 'dist'。

  • assetsDir：指定静态资源的输出目录，默认为 'assets'。在构建过程中，这些资源将被复制到输出目录。

  • sourcemap：控制是否生成源映射文件，默认为 true。

  • rollupOptions：通过该选项可以自定义 Rollup 打包的配置。可以配置 Rollup 的插件、模块解析方式、代码拆分等。

• plugins：配置插件。Vite 使用插件系统来扩展其功能。可以通过该选项引入各种插件，如编译 TypeScript、处理 CSS、压缩代码等

• server：开发服务器相关的配置选项。

  • host：指定服务器绑定的主机名，默认为 'localhost'。

  • port：指定服务器监听的端口，默认为 3000。

  • proxy：配置代理服务器，用于解决开发过程中的跨域问题。

  • open：控制是否在启动开发服务器时自动打开浏览器，默认为 true。

更多配置，请到文档中查看 https://cn.vitejs.dev/guide/cli.html