GPTs使用
GPTs工作原理
本平台的GPTs跟OpenAI官方的GPTs定义大体相似。
本平台的GPTs 提供了一种更智能、更个性化的体验，无需每次都进行教育，使用户能够更精准的生成目标代码。它可以通过组合指令、额外知识，来适应各种场景。用户可以ScriptEcho平台创建自己的GPT，并与其他用户共享。
具体来说，就是用户设置的GPTs，将嵌入到系统提示词中，增强大模型的文本提示内容。
GPTs使用场景
由于实际的前端开发工作比较复杂，GPTs存在的重要价值，是能够让平台用户定义自己的生成规则。具体来说，可以用到以下几种场景：
- 定义项目内所有页面的风格。例如，指定主色调、字体大小等；
- 使用自定义的组件。例如，平台内置了echarts组件，但是用户自己想使用别的图表组件替代echarts；或者使用用户自己的组件库；
- 给大模型更多的生成背景知识；
使用GPTs定义项目内页面的风格/主题
布局
布局主要涉及到两个方面：
- 对不同屏幕的响应式要求；
- 对页面总体排布的要求；
例如：
- 页面的内边距设定为1em；
- 所有的卡片组件之间，上下左右的间距均为 0.75em；
颜色
颜色主要涉及到：
- 总体配色方案；
- 组件颜色控制；
例如：
- 页面背景颜色为 #F0F0F0；
- 所有的卡片背景颜色为纯白色；
- ECharts图表的颜色使用以下几种：#ff0000, #00ff00, #0000ff
字体
字体主要涉及：
- 字体类型，如宋体；
- 字体大小；
- 字体颜色；
- 行高；
例如：
- 所有的字体采用微软雅黑；
- 所有文字大小，采用以下大小：12px，15px，18px
- 所有行高采用以下大小：20px，22px，24px
图标
图标作为页面的一个很重要的装饰品，对页面的美观起到了重要的作用。本平台采用的Iconify图标库具有数十万个图标。
图标的GPTs主要涉及到：
- 图标的形状；
- 图标的大小；
- 图标的颜色；
- 图标的交互控制；
例如：
- 所有图标大小为 40px；
- 所有的图标，鼠标hover时，颜色变为 #0000ff；当鼠标离开时，鼠标恢复为灰色 #333333；
阴影
通常页面内的卡片容器需要设置阴影。
动画
平台支持多种动画库。默认的动画库为 Animate.css。
例如：
- 所有的卡片组件，采用渐进出现/渐进消失的动画；
使用GPTs生成依赖自有组件的代码
所有被依赖的组件，必须被编译为esm格式才能被平台使用。
例如：
- 请使用lodash-es完成逻辑代码生成的简化，请使用 import _ from 'https://esm.sh/lodash@4.17.21' 来引用lodash；