feat(template): 自定义渲染

使用命令来启动自定义渲染模板的程序

docs/README.md

@@ -1,4 +1,4 @@
-# 为什么喜欢使用 Glidea <!-- {docsify-ignore-all} -->
+# 为什么喜欢使用 Glidea :id=like <!-- {docsify-ignore-all} -->
 
 <div align="center">
 
@@ -55,7 +55,7 @@
 <br/>
 <br/>
 
-# 主题
+# 主题 :id=theme
 
 <div align="center">
   <br/>
@@ -73,7 +73,7 @@
 <br/>
 <br/>
 
-# 客户端下载
+# 客户端下载 :id=install
 
 [install](./commont/install.md ':include')
 
@@ -82,7 +82,7 @@
 
 ______
 
-### 其它
+### 其它 :id=other
 
 [源码地址](https://github.com/wonder-light/glidea)
 

docs/en-us/README.md

@@ -1,4 +1,4 @@
-# Why do you like Glidea <!-- {docsify-ignore-all} -->
+# Why do you like Glidea :id=like <!-- {docsify-ignore-all} -->
 
 <div align="center">
 
@@ -55,7 +55,7 @@
 <br/>
 <br/>
 
-# Themes
+# Themes :id=theme
 
 <div align="center">
 
@@ -74,15 +74,15 @@
 <br/>
 <br/>
 
-# Client download
+# Client download :id=install
 
 [install](../commont/install.md ':include')
 
 Current version: v1.0.0 [✨ What's new?](https://github.com/wonder-light/glidea/releases)
 
 ______
 
-### Other
+### Other :id=other
 
 [Source address](https://github.com/wonder-light/glidea)
 

docs/en-us/docs/_sidebar.md

@@ -9,6 +9,7 @@
   * [Variable](en-us/docs/theme/var.md)
   * [Custom](en-us/docs/theme/custom.md)
   * [Share](en-us/docs/theme/shared.md)
+  * [Render](en-us/docs/theme/render.md)
 * Guide
   * [Install](en-us/docs/guide/install.md)
   * [FAQ](en-us/docs/guide/faq.md)

docs/en-us/docs/changelog.md

@@ -1,4 +1,4 @@
 
-# Change Log
+# Change Log :id=changelog
 
 [filename](https://raw.githubusercontent.com/wonder-light/glidea/refs/heads/main/CHANGELOG-en.md ':include')

docs/en-us/docs/guide/faq.md

@@ -1,3 +1,3 @@
-# FAQ
+# FAQ :id=faq
 
 ## 1

docs/en-us/docs/guide/install.md

@@ -1,4 +1,4 @@
-# Installing the client
+# Installing the client :id=install
 
 [install](../../../commont/install.md ':include')
 

docs/en-us/docs/theme/custom.md

@@ -1,5 +1,5 @@
 
-# Theme customization
+# Theme customization :id=theme-custom
 
 > Glidea provides powerful theme customization capabilities, you can design your own custom configuration to provide theme users
 
@@ -8,7 +8,7 @@ Each theme is optionally paired with a `config.json` configuration file and a `s
 
 ## Example :id=example
 
-### config.json
+### config.json :id=config
 
 ```json
 {
@@ -102,7 +102,7 @@ Each theme is optionally paired with a `config.json` configuration file and a `s
 }
 ``` 
 
-### style-override.dart
+### style-override.dart :id=style-override
 
 ```django
 {# Dark skin #}
@@ -208,6 +208,7 @@ the format for each element is as follows：
 }
 ```
 
+
 ## Array type configuration :id=array-config
 
 ```json
@@ -266,10 +267,11 @@ the format for each element is as follows：
 In most cases, using the input type is sufficient
 
 
-These fields can be used either in the template (corresponding to: [`site.customconfig.customField`](#configjson)) or in the style overlay file (corresponding to: input)
+These fields can be used either in the template (corresponding to: [`site.customconfig.customField`](#config)) or in the style overlay file (corresponding to: input)
 
 When used in the template, you can play your imagination, social, statistics, friend chain, external chain background map, background music...
 
+
 ## Style overlay configuration :id=style-override
 
 Of course, it can also be used in style overlay files:

docs/en-us/docs/theme/dev.md

@@ -115,4 +115,9 @@ Macros can then be called like functions:
 ``` django
 <p>{{ input('username') }}</p>
 <p>{{ input('password', type='password') }}</p
-```
+```
+
+
+## Custom rendering :id=custom
+
+Need to customize the rendering template can refer to [here](/en-us/docs/theme/render) Oh!

docs/en-us/docs/theme/render.md

@@ -0,0 +1,52 @@
+# Custom rendering templates :id=template
+
+!> Due to the use of commands to start the program, there are cases that some devices do not support\
+Please explain how to use good friends!
+
+## Set custom :id=custom
+
+Add the `process` field to `config.json` and use the node.js example
+
+```json
+// <Theme Dir>/config.json
+{
+  "name": "fog",
+  "version": "1.0",
+  "author": "wonder-light",
+  "repository": "https://github.com/wonder-light/glidea-theme-fog",
+  "process": "node ./index.js",
+  "customConfig": {}
+}
+```
+
+### Argument :id=params
+
+The output path and the path to render data are injected \
+at the end of the command before starting the program, and also in 'env'
+
+```shell
+node ./index.js  
+#=>
+node ./index.js C:/.../output C:/.../render/config.json
+# There is a path.json directory in the config.json sibling directory to refer to the path writing
+```
+
+### Environment :id=env
+
+```js
+console.log(process.argv[process.argv.length - 2]);
+// C:/.../output
+
+console.log(process.argv[process.argv.length - 1]);
+// C:/.../render/config.json
+
+console.log(process.env['buildDir']);
+// C:/.../output
+
+console.log(process.env['renderData']);
+// C:/.../render/config.json
+
+console.log(process.env['renderPath']);
+// C:/.../render/paths.json
+```
+

docs/en-us/docs/theme/shared.md

@@ -1,4 +1,4 @@
-# Share Theme
+# Share Theme :id=share
 
 > Share your theme with your friends on GitHub
 

docs/en-us/themes/README.md

@@ -1,4 +1,4 @@
-# Theme
+# Theme :id=theme
 
 <div style="width: 100%;" align="center">
   <theme-list label="default" shared="share your theme!"></theme-card>

docs/zh-cn/docs/_sidebar.md

@@ -9,6 +9,7 @@
   * [变量](zh-cn/docs/theme/var.md)
   * [自定义](zh-cn/docs/theme/custom.md)
   * [分享](zh-cn/docs/theme/shared.md)
+  * [渲染](zh-cn/docs/theme/render.md)
 * 指南
   * [安装](zh-cn/docs/guide/install.md)
   * [常见问题](zh-cn/docs/guide/faq.md)

docs/zh-cn/docs/changelog.md

@@ -1,4 +1,4 @@
 
-# 更改日志
+# 更改日志 :id=changelog
 
 [filename](https://raw.githubusercontent.com/wonder-light/glidea/refs/heads/main/CHANGELOG.md ':include')

docs/zh-cn/docs/guide/ability.md

@@ -1,5 +1,5 @@
 
-# 功能
+# 功能 :id=ability
 
 <br/>
 

docs/zh-cn/docs/guide/faq.md

@@ -1,3 +1,3 @@
-# 常见问题
+# 常见问题 :id=faq
 
 ## 1

docs/zh-cn/docs/theme/custom.md

@@ -1,5 +1,5 @@
 
-# 主题自定义
+# 主题自定义 :id=theme-custom
 
 > Glidea 提供了强大的主题自定义能力，你可以自行设计自定义配置提供给主题使用者
 
@@ -8,7 +8,7 @@
 
 ## 示例 :id=example
 
-### config.json
+### config.json :id=config
 
 ```json
 {
@@ -102,7 +102,7 @@
 }
 ``` 
 
-### style-override.j2
+### style-override.j2 :id=style-override
 
 ```django
 {# 暗黑皮肤 #}
@@ -208,6 +208,7 @@
 }
 ```
 
+
 ## 数组类型配置 :id=array-config
 
 ```json
@@ -266,7 +267,7 @@
 大部分情况下，使用 input 类型的就够用了
 
 
-这些字段都可以在模版中（对应: [`site.customConfig.自定义字段`](#configjson)）或样式覆盖文件（对应：入参）中使用
+这些字段都可以在模版中（对应: [`site.customConfig.自定义字段`](#config)）或样式覆盖文件（对应：入参）中使用
 
 在模版中使用时，你可以尽情发挥你的想象，社交、统计、友链、外链背景图、背景音乐...
 

docs/zh-cn/docs/theme/dev.md

@@ -112,4 +112,8 @@
 ``` django
 <p>{{ input('username') }}</p>
 <p>{{ input('password', type='password') }}</p
-```
+```
+
+## 自定义渲染 :id=custom
+
+需要自定义渲染模板的可以参考[这里](/zh-cn/docs/theme/render)哦!

docs/zh-cn/docs/theme/render.md

@@ -0,0 +1,51 @@
+# 自定义渲染模板 :id=template
+
+!> 由于使用的是由命令来启动程序, 所以存在着部分设备不怎么支持的情况,\
+请各位小伙伴说明好使用办法哦!
+
+## 设置自定义 :id=custom
+
+在 `config.json` 中添加 `process` 字段即可, 接下来以 node.js 示例
+
+```json
+// <主题目录>/config.json
+{
+  "name": "fog",
+  "version": "1.0",
+  "author": "wonder-light",
+  "repository": "https://github.com/wonder-light/glidea-theme-fog",
+  "process": "node ./index.js",
+  "customConfig": {}
+}
+```
+
+### 参数 :id=params
+
+在启动程序前会在命令的后面注入输出路径和渲染数据所在路径, 也会在 `env` 中注入
+
+```shell
+node ./index.js  
+#=>
+node ./index.js C:/.../output C:/.../render/config.json
+# 在 config.json 同级目录下有一个 paths.json 可以参考路径的写法
+```
+
+### 环境 :id=env
+
+```js
+console.log(process.argv[process.argv.length - 2]);
+// C:/.../output
+
+console.log(process.argv[process.argv.length - 1]);
+// C:/.../render/config.json
+
+console.log(process.env['buildDir']);
+// C:/.../output
+
+console.log(process.env['renderData']);
+// C:/.../render/config.json
+
+console.log(process.env['renderPath']);
+// C:/.../render/paths.json
+```
+

docs/zh-cn/docs/theme/shared.md

@@ -1,4 +1,4 @@
-# 分享主题
+# 分享主题 :id=share
 
 > 将小伙伴你的主题分享到 Github 吧
 

docs/zh-cn/themes/README.md

@@ -1,4 +1,4 @@
-# 主题
+# 主题 :id=theme
 
 <div style="width: 100%;" align="center">
   <theme-list label="默认" shared="分享你的主题！"></theme-card>