# Source: https://rsbuild.dev/config/html/template-parameters.md

# html.templateParameters

* **Type:** `Record<string, unknown> | Function`
* **Default:**

```ts
type DefaultParameters = {
  mountId: string; // the value of `html.mountId` config
  entryName: string; // entry name
  assetPrefix: string; // the value of dev.assetPrefix or output.assetPrefix configs
  compilation: Compilation; // Compilation object of Rspack
  rspackConfig: Rspack.Configuration; // Rspack config object
  // generated by html-rspack-plugin
  htmlPlugin: {
    tags: {
      headTags: HtmlTagObject[];
      bodyTags: HtmlTagObject[];
    };
    files: {
      publicPath: string;
      js: string[];
      css: string[];
      favicon?: string;
    };
  };
};
```

Define the parameters in the HTML template, see [HTML Template - Template Parameters](/guide/basic/html-template.md#template-parameters) for detailed usage.

## Object usage

If the value of `templateParameters` is an object, it will be merged with the default parameters using `Object.assign`.

For example, if you need to use the `foo` parameter in an HTML template, you can add the following settings:

```ts title="rsbuild.config.ts"
export default {
  html: {
    templateParameters: {
      foo: 'bar',
    },
  },
};
```

Then, you can read the parameter in the HTML template using `<%= foo %>`:

```html
<script>
  window.foo = '<%= foo %>';
</script>
```

The compiled HTML code will be:

```html
<script>
  window.foo = 'bar';
</script>
```

## Function usage

* **Type:**

```ts
type TemplateParametersFunction = (
  defaultValue: Record<string, unknown>,
  utils: { entryName: string },
) => Record<string, unknown> | void;
```

When `html.templateParameters` is of type Function, the function receives two parameters:

* `value`: Default `templateParameters` configuration of Rsbuild.
* `utils`: An object containing the `entryName` field, corresponding to the name of the current entry.

In the context of a multi-page application (MPA), you can set different `templateParameters` based on the entry name:

```ts title="rsbuild.config.ts"
export default {
  html: {
    templateParameters(defaultValue, { entryName }) {
      const params = {
        foo: {
          ...defaultValue,
          type: 'Foo',
        },
        bar: {
          ...defaultValue,
          type: 'Bar',
          hello: 'world',
        },
      };
      return params[entryName] || defaultValue;
    },
  },
};
```