close
Guide
Config
Plugin
API
Community
Guide
Config
Plugin
API
Community

html.template

  • Type: string | Function

Specifies the file path for the HTML template, which can be a relative or absolute path.

If template is not specified, the built-in HTML template of Rsbuild will be used by default:

<!doctype html>
<html>
  <head></head>
  <body>
    <div id="<%= mountId %>"></div>
  </body>
</html>

String Usage

For example, to replace the default HTML template with the static/index.html file, you can add the following configuration:

export default {
  html: {
    template: './static/index.html',
  },
};

Function Usage

  • Type:
type TemplateFunction = ({ value: string; entryName: string }) => string | void;

When html.template is of type Function, the function receives an object as an argument, with the following properties:

  • value: the default template configuration of Rsbuild.
  • entryName: the name of the current entry.

In the MPA (multi-page application) scenario, you can return different template paths based on the entry name, thus setting different templates for each page:

export default {
  html: {
    template({ entryName }) {
      const templates = {
        foo: './static/foo.html',
        bar: './static/bar.html',
      };
      return templates[entryName] || './static/index.html';
    },
  },
};