主题既可以全新制作，也可以继承自其他主题

在这里新建一个主题模块test-cmsthemehello，在首页渲染一行Hello world

1. 新建主题模块

主题模块本质上也是EggBornJS模块

进入项目目录，执行CabloyJS提供的脚手架创建一个新模块

  1. 1$ cd /path/to/project
  2. 2$ npm run cli :create:module test-cmsthemehello -- --template=module

2. 修改package.json

test-cmsthemehello/package.json

  1. 1{
  2. 2  "name": "egg-born-module-test-cmsthemehello",
  3. 3  "version": "1.0.0",
  4. 4  "title": "cms:theme:hello",
  5. 5  "eggBornModule": {
  6. 6    "cms": {
  7. 7      "name": "hello",
  8. 8      "theme": true,
  9. 9      "extend": ""
  10. 10    },
  11. 11    ...
  12. 12  }
  13. 13}
名称 说明
name 必须按照EggBornJS模块的命名规范: egg-born-module-{providerId}-{moduleName}
cms
cms.name 主题名称
cms.theme 声明本模块是一个主题
cms.extend 如果要继承主题，填入原主题的模块名，如cms-themeblog

3. 配置参数

主题可以提供自定义的参数

test-cmsthemehello/backend/src/config/config.js

  1. 1module.exports = appInfo => {
  2. 2  const config = {};
  3. 3
  4. 4  // theme
  5. 5  config.theme = {
  6. 6    _message: 'Hello World',
  7. 7  };
  8. 8
  9. 9  return config;
  10. 10};

4. 创建首页渲染模版

test-cmsthemehello/backend/cms/theme/main/index/index.ejs

  1. 1<html>
  2. 2 <head></head>
  3. 3 <body><%=site._message%></body>
  4. 4</html>

5. 其他源码及资源

根据需要添加其他源码及资源，这里从略

6. 后端Api路由、前端组件

需要再次强调，主题模块本质上也是EggBornJS模块，因此完全可以像一般的业务模块一样，开发后端Api路由和前端组件，从而提供更丰富的功能

7. 发布模块

可以将制作好的模块发布到Cabloy商店

  1. 1$ cd /path/to/project
  2. 2$ npm run cli :store:publish test-cmsthemehello

8. 最佳实践

前面提到，可以在custom目录添加页面元素，从而覆盖默认资源，实现自定义

当然，最好的自定义方式就是通过继承的机制新建主题模块