dev.assetPrefix#

• 类型： boolean | string | 'auto'
• 默认值： '/'

设置开发环境下的静态资源 URL 前缀。

assetPrefix 会影响构建产物中绝大部分静态资源的 URL，包括 JavaScript 文件、CSS 文件、图片、视频等。如果指定了一个错误的值，则在加载这些资源时可能会出现 404 错误。

该配置项仅用于开发环境。在生产环境下，请使用 output.assetPrefix 配置项进行设置。

Boolean 类型#

如果设置 assetPrefix 为 true，Rsbuild 会使用 http://localhost:<port>/ 作为 URL 前缀：

export default {
  dev: {
    assetPrefix: true,
  },
};

在浏览器中加载的资源 URL 如下：

<script defer src="http://localhost:3000/static/js/main.js"></script>

如果设置 assetPrefix 为 false 或不设置，则默认使用 / 作为访问前缀。

String 类型#

当 assetPrefix 的值为 string 类型时，字符串会作为前缀，自动拼接到静态资源访问 URL 上。

• 比如设置为相对于根目录的路径：

export default {
  dev: {
    assetPrefix: '/example/',
  },
};

在浏览器中加载的资源 URL 如下：

<script defer src="http://localhost:3000/example/static/js/index.js"></script>

• 比如设置为完整 URL：

export default {
  dev: {
    assetPrefix: 'https://example.com/assets/',
  },
};

在浏览器中加载的资源 URL 如下：

<script defer src="https://example.com/assets/static/js/index.js"></script>

路径类型#

assetPrefix 可以设置为以下类型的路径：

• 绝对路径：这是最常见的做法，可以为指定服务器路径，比如 /assets/。
• 'auto'：Rspack 将自动计算路径，并生成基于文件所在位置的相对路径。

对比 publicPath#

dev.assetPrefix 的功能与 Rspack 的 output.publicPath 配置基本一致。

它与原生配置的区别在于：

• dev.assetPrefix 仅在开发环境下生效。
• dev.assetPrefix 默认会自动补全尾部的 /。
• dev.assetPrefix 的值会写入 process.env.ASSET_PREFIX 环境变量（只能在 client 代码中访问）。