So I am following the documentaion and have some issues with getting javascript to work for my extension. The php side works perfectly but when I try to do the javascript I get the following issue in my developer console. Cannot read property 'default' of undefined over at
for (var i in modules) {
var module = System.get(modules[i]);
if (module.default) module.default(app);
}
Now my extension is getting loaded as you can see here
var modules = ["locale","flagrow\/analytics\/main","johnhearfield\/auth-google\/main","sijad\/recaptcha\/main","Davis\/SecureHttps\/main","vingle\/share\/social\/main","flarum\/approval\/main","flarum\/emoji\/main","flarum\/auth\/facebook\/main","flarum\/flags\/main","ml\/hello-word\/main","flarum\/likes\/main","flarum\/lock\/main","xengine\/mdeditor\/main","flarum\/mentions\/main","flarum\/sticky\/main","flarum\/subscriptions\/main","flarum\/suspend\/main","flarum\/tags\/main","flarum\/auth\/twitter\/main"];
In my bootstrap.php I got the following
use Illuminate\Contracts\Events\Dispatcher;
return function (Dispatcher $events) {
$events->listen(\Flarum\Event\PostWillBeSaved::class, function (\Flarum\Event\PostWillBeSaved $event) {
$event->post->content = 'This is not what I wrote';
});
$events->listen(\Flarum\Event\ConfigureWebApp::class, function (\Flarum\Event\ConfigureWebApp $event) {
if ($event->isForum()) {
$event->addAssets(__DIR__ . '/js/forum/dist/extension.js');
$event->addBootstrapper('ml/hello-word/main');
}
});
};
Inside my js/forum/src/main.js I got the following
import { extend } from 'flarum/extend';
import app from 'flarum/app';
import Post from 'flarum/components/Post';
app.initializers.add('ml/hello-world', () => {
extend(Post.prototype, 'view', function(vdom) {
console.log(vdom)
vdom.children.push(':D');
vdom.attrs.style = 'background-color: yellow';
});
});
Inside my js/forum/dist/extension I got the following
System.register('ml/hello-world/main', ['flarum/extend', 'flarum/app', 'flarum/components/Post'], function (_export) {
'use strict';
var extend, app, Post;
return {
setters: [function (_flarumExtend) {
extend = _flarumExtend.extend;
}, function (_flarumApp) {
app = _flarumApp['default'];
}, function (_flarumComponentsPost) {
Post = _flarumComponentsPost['default'];
}],
execute: function () {
app.initializers.add('ml/hello-world', function () {
extend(Post.prototype, 'view', function (vdom) {
console.log(vdom);
vdom.children.push(':D');
vdom.attrs.style = 'background-color: yellow';
});
});
}
};
});
Would love some help.
