The module cms-pluginbase is the official basic plugin. It is recommended that theme modules reference this plugin module, and flexibly customize your own features based on the basic features provided by this plugin

Plugin Definition


  "name": "egg-born-module-cms-pluginbase",
  "version": "1.0.9",
  "title": "cms:plugin:base",
  "eggBornModule": {
    "cms": {
      "name": "base",
      "plugin": true
    "dependencies": {
      "a-instance": "1.0.0"
Name Description
“plugin”: true indicate this is a plugin module


include.ejs is the auto-include template file. When rendering, the system automatically includes this template file

Therefore, you can declare CSS and JS resources in include.ejs


  // css

  // js

  // js:init


This template file defines the logic to be initialized when page loaded


$(document).ready(function() {
  // echo
  // img delay
  $.each($('.img-delay'), (index, item) => {
    const $item = $(item);
    const src = $'src');
    const width = $'width');
    const height = $'height');
    $item.attr('src', util.combineImageUrl(src, width, height));


echo is used to perform the backend APIs and return the information of the current user


echo() {
  return util.ajax({
    url: '/a/base/auth/echo',
  }).then(data => {
    this.user = data.user;
    $(document).trigger('echo-ready', data);

After retrieving the information of the current user, a JQuery event echo-ready is triggered, which makes it easy for other logic to be executed when echo-ready triggered

Image Delay Loading

cms-pluginbase has built-in delay loading feature, and automatically matches device pixel ratio in order to load the image of suitable size

The image that needs to be loaded with delay is defined as follows:

<img class="img-delay" data-src="{url}" data-width="{width}" data-height="{height}">

Util Object: util

The core feature of cms-pluginbase is to provide a util object util, whose structure is as follows:

  ajax: [Function],
  performAction: [Function],
  combineImageUrl: [Function],
  echo: [Function],
  escapeHtml: [Function],
  escapeURL: [Function],
  formatDateTime: [Function],
  loadMore: [Function],
  parseUrlQuery: [Function],
  promise: [Function],
  rootUrl: [Function],
  time: [Object],
  url: [Function],
  user: [Object]
Name Type Description
ajax method perform the backend APIs
performAction method perform the backend APIs via ajax
combineImageUrl method combine image URL, automatically matching device pixel ratio
echo method used to perform the backend API, retrieve the current user’s information, and trigger the JQuery event echo-ready
escapeHtml method create safe HTML
escapeURL method create safe URL
formatDateTime method format the date time according to the current site configuration
loadMore method load more when infinite scrolling
parseUrlQuery method parse URL’s query parameters
promise method If there is no window.Promise, create one automatically
rootUrl method return the root path URL of the specified language
time property Time Tools
url method return the absolute path of the url
user property the current user’s information returned by echo