Deploy any code to client/server runtime in any time.
- Add to your meteor project:
meteor add itgenio:live-modules
- (server side) Register modules:
- by inserting documents into
LiveModulesCollection
; - by using helper class
LiveModulesServiceDefault
.
- (client/server side) Use
LiveModules.importModule(...)
orLiveModules.importModules(..)
anywhere to import a code.
- Enable/disable modules
- Import modules by specific tags or name
importTimeout
to control imports time- Works with JS & CSS
- Server and Client
{
"public": {
"liveModules": {
"collName": "meteor_itgenio_live-modules",
"subName": "itgenio.live-modules",
"logging": true,
"importTimeout": 5000,
"subOnStartup": true,
"jsMarker": "/*js-content*/"
}
}
}
- Add the package:
meteor add itgenio:live-modules
- Register live module (server side):
server/index.js
:
import { LiveModulesConfig, LiveModulesCollection } from 'meteor/itgenio:live-modules';
LiveModulesCollection.remove({}); //clean all modules
LiveModulesCollection.insert({
name: 'test-module1',
v: 0,
tags: ['startup'],
enabled: true,
required: false,
source: `${LiveModulesConfig.jsMarker} console.log('Hello from test-module1');`,
});
LiveModulesCollection.insert({
name: 'test-module2',
v: 0,
tags: ['startup'],
enabled: true,
required: false,
source: `${LiveModulesConfig.jsMarker} console.log('Hello from test-module2');`,
});
- Import live module (client side):
client/index.js
:
import { LiveModules } from 'meteor/itgenio:live-modules';
(async () => {
await LiveModules.importModule('test-module1'); //by name
})();
- Done! Check your console in the browser for a line
Hello from test-module1
Import by tag on startup
import { LiveModules } from 'meteor/itgenio:live-modules';
Meteor.startup(async () => {
//...
//
// Import all modules with tag `startup`
//
try {
await LiveModules.importModules(['startup']);
} catch (e) {
console.error(e);
}
//...
});
Import by name in specific page
import { LiveModules } from 'meteor/itgenio:live-modules';
const lazy = () => LiveModules.importModule('my-lazy-component');
//suspense is HOC for <Suspense/> from react
const SubComponent = suspense(() => {
//Some magic...
//But you just waiting for resolving promise
const { LazyComponent } = useService(lazy);
return LazyComponent;
});
export function MyPage() {
return <SubComponent />;
}
evaluate as JS
If the url ends with .js/.cjs
or the source
field starts with LiveModulesConfig.jsMarker (by
default, /*js-content*/
).
It's not safe, so be careful to use source
field.
evaluate as CSS
If the url ends with .css
or the source
field doesn't start with LiveModulesConfig.jsMarker
.
Only works on the Client side.
- https://github.com/benjamn/install
- https://github.com/benjamn/reify
- https://github.com/meteor/meteor/tree/ffcfa5062cf1bf8a64ea64fef681ffcd99fe7939/packages/modules-runtime
npm run test