一、为什么需要DSL?
用一份 DSL 配置渲染整个站点,沉淀 80% 重复性体力活,聚焦 20% 定制化需求,既控制时间成本,又能集中精力提升架构设计能力。
二、设计逻辑:领域模型驱动的配置复用
遵循「领域模型 → 项目 → 配置」的设计:
- 领域模型(model) :定义电商、网课等领域的通用配置(如商品模块、课程模块的基础结构);
- 项目(project) :基于领域模型,通过 继承、扩展、重载 生成项目专属配置;
- 配置(config) :整合模型通用配置与项目定制配置,最终渲染站点。
三、实际应用:全链路自动化生成
1. DSL核心解析规则
2. 全链路生成流程
3. 页面渲染架构
4. 核心 schema 源数据结构
// 当 moduleType == schema 时
schemaConfig: {
api: '', // 数据源API(遵循 RESTFUL 规范)
schema: { // 板块数据结构
type: 'object',
properties: {
key: {
...schema, // 标准 schema 配置
type: '', // 字段类型
label: '', // 字段中文名
// 字段在 table 中的相关配置
tableOption: {
...elTableColumnConfig, // 标准 el-table-column 配置
toFixed: 0, // 保留小数点后几位
visible: true, // 默认为 true(false 或 不配置时,表示不在表单中显示)
},
// 字段在 search-bar 中的相关配置
searchOption: {
...eleComponentConfig, // 标准 el-component-column 配置
comType: '', // 配置组件类型 input/select/......
default: '', // 默认值
// comType === 'select'
enumList: [],
// comType === 'dynamicSelect'
api: ''
}
},
...
}
},
// table 相关配置
tableConfig: {
headerButtons: [{
label: '', // 按钮中文名
eventKey: '', // 按钮事件名
eventOption: {}, // 按钮具体配置
...elButtonConfig // 标准 el-button 配置
}, ...],
rowButtons: [{
label: '', // 按钮中文名
eventKey: '', // 按钮事件名
eventOption: {
// eventKey === 'remove'
params: {
// paramKey = 参数的键值
// rowValueKey = 参数值,格式为 schema::tableKey 的时,到 table 中找到响应的字段
paramKey: rowValueKey
}
}, // 按钮具体配置
...elButtonConfig // 标准 el-button 配置
}, ...]
},
searchConfig: {}, // search-bar 相关配置
components: {} // 模块组件
},
四、能力提升:从「就事论事」到「抽象复用」
- 告别「需求来了就写代码」的线性思维,学会从领域层面抽象通用能力;
- 建立「模型驱动开发」的架构思维,这种能力可跨业务、跨行业复用;
- 从「代码搬运工」成长为「架构设计者」,核心竞争力持续提升。
通过 DSL 配置化开发,我们不仅提升了开发效率,更沉淀了可复用的领域能力,实现了个人与项目的双向成长。