CODEWITHSUNDEEP
javascriptjspmsystemjs
Pablo
Pablo

Reputation: 2549

How do I import a named SystemJS module from a bundle file?

I've got one file (app.js) with two named modules in it ("foo", and "bar" - where "bar" depends on "foo").

Question: How to I load "bar" it in the browser?

Disclaimer: I'm new to SystemJS and the docs look a little intimidating.

app.js

System.register("foo", [], function(exports_1) {
    "use strict";
    var App;
    return {
        setters:[],
        execute: function() {
            App = (function () {
                function App() {
                    this.bar = 'Hello world.';
                    console.log(this.bar);
                }
                return App;
            })();
            exports_1("App", App);
            ;
        }
    }
});

System.register("bar", ["foo"], function(exports_1) {
    "use strict";
    var App;
    return {
        setters:[],
        execute: function() {
            App = (function () {
                function App() {
                    this.bar = 'Mony a mickle maks a muckle.';
                    console.log(this.bar);
                }
                return App;
            })();
            exports_1("App", App);
            ;
        }
    }
});

Upvotes: 4

Views: 1715

Answers (2)

Sloppy Lopez
Sloppy Lopez

Reputation: 51

I think using a bare bones seed can help you out by showing a simple working example, this seed has a PRODUCTION and DEV MODE and you dont need to have 2 strategies, just choose between running it bundled or not

try: npm i -g slush-jspm-react-seed

Upvotes: 0

Pablo
Pablo

Reputation: 2549

Got the results I wanted by doing the following:

  • Added the <script src="app.js"> tag to my index file.
  • Also added System.import('bar'); to the page.

I wonder if this is the standard/recommended way of doing it.

Edit:

The issue with this approach is that I need two strategies for development and production.

In development I don't add the <script> tag and I import the module using System.import('path/app.js');

Upvotes: 1

Related Questions