WARNING

在 Modern.js 开发阶段,或是使用 Modern.js 服务器部署应用时,应避免使用该配置修改 html 产物文件名,会导致页面 404。

通常情况下,无需修改 html 产物文件名。常见的需求是将 main.html 修改为 index.html,请使用 source.mainEntryName

output.filename

  • 类型:
type FilenameConfig = {
  html?: string;
  js?:
    | string
    | ((pathData: Rspack.PathData, assetInfo: Rspack.JsAssetInfo) => string);
  css?: string;
  svg?: string;
  font?: string;
  image?: string;
  media?: string;
  assets?: string;
};
  • 默认值:
// 开发模式构建
const devDefaultFilename = {
  html: '[name].html',
  js: '[name].js',
  css: '[name].css',
  svg: '[name].[contenthash:8].svg',
  font: '[name].[contenthash:8][ext]',
  image: '[name].[contenthash:8][ext]',
  media: '[name].[contenthash:8][ext]',
  assets: '[name].[contenthash:8][ext]',
};

// 生产模式构建
const prodDefaultFilename = {
  html: '[name].html',
  js: output.target === 'node' ? '[name].js' : '[name].[contenthash:8].js',
  css: '[name].[contenthash:8].css',
  svg: '[name].[contenthash:8].svg',
  font: '[name].[contenthash:8][ext]',
  image: '[name].[contenthash:8][ext]',
  media: '[name].[contenthash:8][ext]',
  assets: '[name].[contenthash:8][ext]',
};

设置构建产物的名称。

INFO

该配置项的使用方式与 Rsbuild 完全一致。详细信息请参考 Rsbuild - output.filename