Creating Custom Modules
Learn how to define a custom ES module for the Signalize JavaScript Framework. Create a new set of functions, define a new page with lazy initialization, etc.
Module Boilerplate
A module in terms of Signalize is a simple export:
- The export function can be asynchronous.
- The module config can be optional.
- The first argument is the Signalize instance in which the module was initialized.
export default async (signalizeInstance, moduleConfig) => {
return {
// Functionality you want to return, if any
}
};
Definition example
Module definition:
// my-module.js
export default (signalize, config) => {
const myFunction = (content) => alert(content);
return {
myFunction
}
}
Lazy module usage:
<script type="importmap">
{
"imports": {
"my-module": "/public/path/to/my-module.js"
}
}
</script>
<script>
import Signalize from 'signalizejs';
const { resolve } = new Signalize({
params: {
/*
"my-module" is found as a key in params, therefore the value of "my-module" will be passed
into the resolved module and merged with the direct config.
*/
'my-module': {}
}
});
const { myFunction } = await resolve('my-module');
// Or with direct config as a completely new instance of the module separate from others
const { myFunction } = await resolve(['my-module', { /* Direct Config */ }]);
myFunction('Hello World!');
</script>
More about modules initialization can be found on the introduction page.