跳转到主文档

output.metaByEntries

  • 类型: Object
  • 默认值: undefined

用于在多页面的场景下,为不同的页面设置不同的 meta 信息。

整体用法与 output.meta 一致,主要区别在于,可以使用「入口名称」作为 key 进行单独设置。

入口名称

默认情况下,「入口名称」为页面入口所在目录的名称。

例如,项目的目录结构如下时,入口名称为 page-apage-b

└── src
├── page-a
│   └── App.jsx
└── page-b
└── App.jsx

如果使用 source.entries 自定义了页面入口,则「入口名称」为 source.entries 对象的 key

示例

modern.config.js
import { defineConfig } from '@modern-js/app-tools';

export default defineConfig({
output: {
meta: {
viewport: 'width=device-width',
description: '今日头条',
},
metaByEntries: {
'page-a': {
description: '抖音',
},
},
},
});

dev 之后可以看到入口 page-a 和 入口 page-b 的 meta 信息分别如下:

  • page-a
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
//...
<meta name="description" content="抖音" />
  • page-b
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
//...
<meta name="description" content="今日头条" />

可以看到入口 page-adescription meta 标签被自定义为 抖音。 入口 page-apage-b 都修改了 viewport meta 标签。