Here, we will create a new plugin module test-cmspluginhello, and popup a prompt Hello world when the page is loaded

1. Create a new plugin module

The plugin module is essentially an EggBornJS module

Go to the project directory and create a new module by executing the scaffold:

$ cd /path/to/project
$ npm init cabloy src/module/test-cmspluginhello --type=module

2. Modify package.json

test-cmspluginhello/package.json

{
  "name": "egg-born-module-test-cmspluginhello",
  "version": "1.0.0",
  "title": "cms:plugin:hello",
  "eggBornModule": {
    "cms": {
      "name": "hello",
      "plugin": true
    },
  },
  ...
}
Name Description
name must follow the naming convention of the EggBornJS module: egg-born-module-{providerId}-{moduleName}
cms
cms.name plugin’s name
cms.plugin indicate this module is a plugin

3. Configuration

The plugin module can provide custom parameters

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

module.exports = appInfo => {
  const config = {};

  // plugin
  config.plugin = {
    _message: 'Hello World',
  };

  return config;
};

4. include.ejs

Add an auto-include template file

test-cmspluginhello/backend/cms/plugin/include.ejs

<%
  // js:init
  js('./init.js.ejs');
%>

5. plugin/init.js.ejs

Popup a prompt Hello world when the page is loaded

test-cmspluginhello/backend/cms/plugin/init.js.ejs

$(document).ready(function() {
  // alert
  const message='<%=site.plugins['test-cmspluginhello']._message%>';
  window.alert(message);
});

6. Other source code and resources

Add other source code and resources as needed, be omitted

7. Backend APIs, Frontend Vue Components

It needs to be emphasized again that the plugin module is also the EggBornJS module in essence, so you can develop backend APIs and frontend vue components like general business modules, so as to provide richer features

8. Build Module

As an EggBornJS module, if it is used inside a project, it does not need to be built and can be used directly. If you want to share it to the community for other users to install and use, you must build it

$ cd src/module/test-cmspluginhello
$ npm run build:front
$ npm run build:backend

9. Publish Module

You can publish the module to the community after building

$ npm publish