Plugin structure

Before jumping into the details of the plugins’ development let’s first have a look on the basic setup of your plugin.

package.json

In order to develop a plugin first you need to properly setup your package.json file so that you include MotorCortex.js on the peerDependencies section of it. The reason we include MotorCortex on the peerDependencies and not on the dependencies section is that MotorCortex will already exist on the final environment that your plugin will be used, as there is no reasonable case your plugin will ever be used without MotorCortex.

The second thing to take care of on your package.json is the main.js file of the plugin. On the package.json file you define it on the key “main”

An example of the package.json file of a plugin is the following:

{
"name": "the-name-of-your-plugin",
"version": "0.0.1",
"description": "Sample plugin for MotorCortex",
"main": "./dist/main.js",
"author": "Name Surname",
"repository": {
"type": "git",
"url": "https://github.com/your-repository-name.git"
},
"license": "MIT",
"keywords": [
"motorcortex",
"animation"
],
"dependencies": {
"a-dependency-of-your-plugin": "^2.2.0"
},
"peerDependencies": {
"@kissmybutton/motorcortex": "^3.0.0"
}
}

main.js

The structure of your main.js file should be an object with the following keys:

  • npm_name: the npm name of your library (the same as the “name” of your package.json file
  • incidents: an array of all exposed Incidents by your plugin
  • compositeAttributes: a list of all composite attributes of your plugin (optional, we’ll have a look later on)

A simple example of a main.js file would be:

const MyIncident = require("./src/MyIncident");
module.exports = {
npm_name: "my-plugin-name",
incidents: [
{
exportable: MyIncident,
name: "MyIncident",
attributesValidationRules: {
animatedAttrs: {
type: "object",
props: {
// validation rules as per [fastest-validator](https://www.npmjs.com/package/fastest-validator) library
}
}
}
}
]
};