Refactor ShaderLab documention

docs/zh/graphics/material/_meta.json

@@ -2,6 +2,6 @@
   "overview": { "title": "材质概述" },
   "examples": { "title": "指南和示例" },
   "builtinShaders": { "title": "内置着色器" },
-  "shaderLab": { "title": "ShaderLab 语法" },
+  "shaderLab": { "title": "ShaderLab" },
   "variables": "内置变量"
 }

docs/zh/graphics/material/shaderLab/_meta.json

@@ -1,8 +1,10 @@
 {
-  "intro": "总览",
-  "shader": "Shader",
-  "editor": "Editor",
-  "subShader": "SubShader",
-  "pass": "Pass",
-  "macro": "宏"
+  "overview": "总览介绍",
+  "property": "材质属性定义",
+  "script": "UIScript 的使用和绑定",
+  "global": "全局变量声明",
+  "renderState": "渲染状态设置",
+  "entry": "顶点、片元着色器程序编写",
+  "multi": "多 Pass Shader 编写",
+  "chunk": "Shader 代码段引用"
 }

docs/zh/graphics/material/shaderLab/chunk.mdx

@@ -0,0 +1,57 @@
+---
+title: Shader 代码段引用
+---
+
+为了方便代码段复用，ShaderLab 中可以如下使用 `include` 宏进行代码段引用，后续编译过程中会被自动扩展替换。
+
+```glsl showLineNumbers
+#include "{includeKey}"
+```
+
+为了能使代码段能够通过 `include` 宏进行引用，我们有 2 种方式进行代码段声明：
+
+## 1. 编辑器中创建 着色器 / 着色器片段
+
+创建的代码段 `includeKey` 为该文件在工程中的文件路径，比如下图中，如果想在 Shader 资产 `UnlitShader` 中引用 `ShaderChunk` 代码段，分别可以通过绝对路径和相对路径引用：
+```glsl showLineNumbers
+// 相对路径
+#include "./ShaderChunk.glsl"
+
+// 编辑器解决路径
+#include "/ShaderChunk.glsl"  // 项目资产根目录
+```
+
+<Image src="https://mdn.alipayobjects.com/huamei_aftkdx/afts/img/A*3UDUS6OtbPUAAAAAAAAAAAAAeteEAQ/fmt.webp"  />
+
+## 2. 脚本中显示注册代码段
+
+```ts showLineNumbers
+import { ShaderFactory } from '@galacean/engine';
+
+const commonSource = `// shader chunk`;
+ShaderFactory.registerInclude('includeKey', commonSource);
+```
+ShaderLab 中引用
+```glsl showLineNumbers
+#include "includeKey"
+```
+
+<Callout>
+
+当前版本中，引擎提供了 `PBR` ShaderLab 内置代码段，开发者可以通过这些内置代码段对 `PBR` Shader 进行自定义扩展。需要注意的是，需要对引擎内置 ShaderLab 代码段进行注册后才可使用。
+
+```ts showLineNumbers {4} filename="Typescript"
+import { registerIncludes } from "@galacean/engine-shader-shaderlab";
+
+// 对内置 ShaderLab 代码段注册。
+registerIncludes();
+```
+
+```glsl showLineNumbers filename="ShaderLab"
+...
+#include "Common.glsl"
+#include "BRDF.glsl"
+...
+```
+官方内置 `PBR` ShaderLab 代码段源码 [参考](https://github.com/galacean/engine/blob/main/packages/shader-shaderlab/src/shaders/PBR.gs)
+</Callout>