用途

用途, 用于 gff 的 thymeamf 模板渲染。
npm start时候, 会被渲染成为 html, npm run build时候会被把 thymleaf 模板做预处理, 保持模板输出。

使用方式

本地安装 tnpm i @ali/plugin-gff-thymeleaf-html -D 然后再 build.json 中添加配置

``
"plugins": [
....
'@ali/plugin-gff-thymeleaf-html',
....
],
`

也可以增加参数
`
[
"@ali/plugin-gff-thymeleaf-html",
{
"data": "index.json",
"filename": "indexV2.html",
},
],
`

| 参数名 | 作用 | 类型 | 默认值 | 备注 |
| -------- | ------------------------------------------- | ------ | ------------ | --------------------------------------- |
| data | 用于 thymleaf 模板渲染的数据 json 地址 | string | "" | 默认使用 npm 包内置的 tempate/data.json |
| filename | 构建后的文件名, | string | "index.html" | | 只在 npm run build 时候生效 |

基础扩展


@ali/plugin-gff-thymeleaf-html 内置扩展点,可以方便进行扩展。

`












`

例如想要在 html头部插入额外HTML 代码片段, 可以在根目录编写一个 head.html。
`

`

并这增加配置
`
[
"@ali/plugin-gff-thymeleaf-html",
{
// 其他配置....

"fragments": {
"head": "head.html"
}
},
],
`

那么原模板会被渲染为
`












`

| 参数名 | 作用 | 类型 | 默认值 | 备注 |
| -------- | ------------------------------------------- | ------ | ------------ | --------------------------------------- |
| fragments | 扩展点配置 | Map | {} | 目前支持的key为head / bodyBefore / bodyAfter |




高级扩展

如果想要彻底定制模板, 可以自行写一个模板 foo-bar.html
`









`

并修改配置项 template, 即可使用。
`
[
"@ali/plugin-gff-thymeleaf-html",
{
// 其他配置....

"template": "foo-bar.html"
},
],
``

| 参数名 | 作用 | 类型 | 默认值 | 备注 |
| -------- | ------------------------------------------- | ------ | ------------ | --------------------------------------- |
| template | 模板地址 | string | "" | 默认使用包内置的 tempate/index.thymleaf.html |